计算器案例

来源：互联网发布：bmob后端云 java 编辑：程序博客网时间：2024/05/19 21:01
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Insert title here</title><style type="text/css">  .panel {        border: 4px solid #ccc;        width: 202px;        margin: 50px auto;  }  .panel p,.panel input{  font-family: "黑体";  font-size:20px;  margin:5px;  float:left;  }  .panel p{  border:4px solid #ddd;  height:30px;  width:123px;  padding:5px;  }  .panel input{  height:40px;  width:40px;  }</style> <script type="text/javascript">      function cal(e) {        var obj = e.target || e.srcElement;        if(obj.nodeName != "INPUT") {          return;        }                var value = obj.value;        var screen = document.getElementById("screen");        if(value=="C") {          screen.innerHTML = "";        } else if (value=="=") {          var exp = screen.innerHTML;          try {            var r = eval("("+exp+")");            screen.innerHTML = r;          } catch(e) {            console.log(e);            screen.innerHTML = "Error";          }        } else {          screen.innerHTML += value;        }      }    </script></head><body>  <div class="panel" onclick="cal(event);"><div> <p id="screen"></p>        <input type="button" value="C">          <div style="clear:both"></div></div><div>        <input type="button" value="7">        <input type="button" value="8">        <input type="button" value="9">        <input type="button" value="/">                <input type="button" value="4">        <input type="button" value="5">        <input type="button" value="6">        <input type="button" value="*">                <input type="button" value="1">        <input type="button" value="2">        <input type="button" value="3">        <input type="button" value="-">                <input type="button" value="0">        <input type="button" value=".">        <input type="button" value="=">        <input type="button" value="+">                <div style="clear:both"></div>             </div></div></body></html>
0 0
计算器 案例

计算器案例
