简单计算器

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>计算器</title>
 <script>
 var initData="";//保存初始字符串
 var num1=0;
 var num2=0;
 var lastop="";//保存最后一个操作符
 //获取数字
 function getNum(num){
 initData += num;
 showData(initData);
 }
 //获得操作符
 function getOp(op){
 lastop=op;
 //保存第一个数
 num1=parseFloat(initData);//转换并保存
 //重新初始化
 initData="";
 }
  
 //获得结果
 function getResult(){
 //第一个数,已保存
 //第二个数
 num2=parseFloat(initData);
 //符号lastop
 //计算
 var result =calc(num1,num2,lastop);
 //显示结果
 showData(result);
 }
 function calc(num1,num2,op){
 var result=0;
 switch(op){
 case'+':result= num1 + num2;break;
 case'-':result= num1 - num2;break;
 case'*':result= num1 * num2;break;
 case'%':result= num1 % num2;break;
 case'/':if(num2==0)return;
 else result =num1/num2;break;
  
 }
 return result;
 }
 //显示数据的方法
 function showData(data){
 document.getElementById("result").value=data;
 }
 //取相反数
 function getOpp(){
 initData=0-parseFloat(initData);
 showData(initData);
 }
 //清除数据
 function getDle(){
 result=0;
 num1=0;
 num2=0;
 lastop=0;
 initData="";
 showData(0);
 }
 function getRe(){
 var sc=initData.substring(0,initData.length-1);
 initData=sc;
 showData(sc);
 }
 </script>
 </head>
  
 <body>
 <form id="form1" name="form1" method="post" action="">
 <table width="476" height="217" border="1" align="center">
 <tr>
 <th colspan="3" scope="col"><label for="num"></label>
 <input type="text" name="num" id="result" value="" /></th>
 <th scope="col"><input type="button" name="el" id="el" value=" C " onclick="getDle()"/></th>
 <th scope="col" align="center"><input type="button" name="el" id="tl" value=" CE " onclick="getRe()"/></th>
 </tr>
 <tr>
 <td align="center"><input type="button" name="z" id="num7" value=" 7 " onclick="getNum('7')"/></td>
 <td align="center"><input type="button" name="z" id="num8" value=" 8 " onclick="getNum('8')" /></td>
 <td align="center"><input type="button" name="z" id="num9" value=" 9 " onclick="getNum('9')" /></td>
 <td align="center"><input type="button" name="el" id="tl" value=" +/- " onclick="getOpp()" /></td>
 <td align="center"><input type="button" name="el" id="fl" value=" % " onclick="getOp('%')"/></td>
 </tr>
 <tr>
 <td align="center"><input type="button" name="z" id="num6" value=" 6 " onclick="getNum('6')"/></td>
 <td align="center"><input type="button" name="z" id="num5" value=" 5 " onclick="getNum('5')" /></td>
 <td align="center"><input type="button" name="z" id="num4" value=" 4 " onclick="getNum('4')" /></td>
 <td align="center"><input type="button" name="el" id="ffl" value=" + " onclick="getOp('+')" /></td>
 <td align="center"><input type="button" name="el" id="sl" value=" - " onclick="getOp('-')" /></td>
 </tr>
 <tr>
 <td align="center"><input type="button" name="one" id="num1" value=" 1 " onclick="getNum('1')"/></td>
 <td align="center"><input type="button" name="z" id="num2" value=" 2 " onclick="getNum('2')"/></td>
 <td align="center"><input type="button" name="z" id="num3" value=" 3 " onclick="getNum('3')" /></td>
 <td align="center"><input type="button" name="el" id="sl" value=" * " onclick="getOp('*')"/></td>
 <td align="center"><input type="button" name="el" id="eel" value=" / " onclick="getOp('/')"/></td>
 </tr>
 <tr>
 <td align="center"><input type="button" name="z" id="num0" value=" 0 " onclick="getNum('0')"/></td>
 <td align="center"><input type="button" name="z" id="ten" value=" . " onclick="getNum('.')" /></td>
 <td>&nbsp;</td>
 <td align="center"><input type="button" name="nl" id="nl" value=" = " onclick="getResult()"/></td>
 <td align="center"><input type="button" name="el" id="tl" value="返回" onclick="getDle()" /></td>
 </tr>
 </table>
 </form>
 </body>
 </html>
 

相关推荐