标签:tar 参数 ane javascrip val pre event value line
<!doctype html> <html> <head> <title>计算器</title> <meta charset="utf-8"> <script type="text/javascript"> //参数e用来接收传入的event事件 function cal(e){ //1.获取事件源,只处理button事件 //浏览器兼容性 var obj=e.srcElement || e.target; if(obj.nodeName != "INPUT"){ return; } var value=obj.value; var p=document.getElementById("screen"); if(value == "C"){ //2.如果是[C],清空p p.innerText=""; }else if(value == "="){ //3.如果是[=],则运算 try{ var sum=parseFloat(eval("("+p.innerText+")")).toFixed(8); p.innerText=sum; }catch(e){ //发生异常,给予错误提示 p.innerText="Err"; } }else{ //4.其他将value追加到p中 p.innerText=p.innerText+value; } } </script> <style type="text/css"> .panel{ border: 3px solid #ccc; width: 160px; margin: 150px auto; } p{ border: 1px solid #ccc; height: 28px; width: 70%; margin: 5px 3px; line-height: 28px; font-family: ‘微软雅黑‘,‘文泉驿正体‘,‘黑体‘; } input{ display: block; width: 30px; height: 30px; margin: 5px 5px; background-color: #ccc; border: 0; float: left; } p{ display: block; float: left; } </style> </head> <body> <div class="panel" onclick="cal(event);"> <div class="display"> <p id="screen"></p> <input type="button" value="C"> <!--此div用来消除浮动影响,设置为不可见--> <div style="border:0;clear:left;"></div> </div> <div class="opreator"> <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用来消除浮动影响,设置为不可见--> <div style="border:0;clear:left;"></div> </div> </div> </body> </html>
标签:tar 参数 ane javascrip val pre event value line
原文地址:http://www.cnblogs.com/AzLee/p/calc.html