欢迎来到代码驿站!

JavaScript代码

当前位置:首页 > 网页前端 > JavaScript代码

js网页版计算器的简单实现

时间:2022-11-04 09:53:37|栏目:JavaScript代码|点击:

复制代码 代码如下:

<!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=gb2312" />
<title>计算器</title>
<script language="javascript" type="text/javascript">
 var clearFlag=false;
 function getNum(num){
 //alert(num);
  var objresult=document.getElementById("result");
  if(clearFlag){
   objresult.value="";
   clearFlag=false;
  }
 //alert(objresult);
 objresult.value+=num;
 }
function getResult(){
 var objresult=document.getElementById("result");
 objresult.value=objresult.value+"="+eval(objresult.value);
 clearFlag=true;
}
</script>
</head>
<body>
<table width="200" border="1" cellpadding="2">
  <tr>
    <td colspan="4"><input type="text" name="result" id="result" size="33"></td>
  </tr>
  <tr>
    <td width="56"><input type="button" value="  1   " onclick="getNum(1)"></td>
    <td width="56"><input type="button" value="  2   " onclick="getNum(2)"></td>
    <td width="51"><input type="button" value="  3   " onclick="getNum(3)"></td>
    <td width="58"><input type="button" value="  +   " onclick="getNum('+')"></td>
  </tr>
  <tr>
    <td><input type="button" value="  4   " onclick="getNum(4)"></td>
    <td><input type="button" value="  5   " onclick="getNum(5)"></td>
    <td><input type="button" value="  6   " onclick="getNum(6)"></td>
    <td><input type="button" value="  -   " onclick="getNum('-')"></td>
  </tr>
  <tr>
    <td><input type="button" value="  7   " onclick="getNum(7)"></td>
    <td><input type="button" value="  8   " onclick="getNum(8)"></td>
    <td><input type="button" value="  9   " onclick="getNum(9)"></td>
    <td><input type="button" value="  *   " onclick="getNum('*')"></td>
  </tr>
  <tr>
    <td><input type="button" value="  0   " onclick="getNum(0)"></td>
    <td><input type="button" value="  .   " onclick="getNum('.')"></td>
    <td><input type="button" value="  =   " onclick="getResult()"></td>
    <td><input type="button" value="  /   " onclick="getNum('/')"></td>
  </tr>
</table>
</body>
</html>

PS:这里再为大家推荐两款本站的在线计算器,都是采用js实现,且功能强大,相信对于大家深入了解JavaScript数学运算及web设计会有所帮助:

在线标准计算器:http://tools.jb51.net/jisuanqi/jsq

在线科学计算器:http://tools.jb51.net/jisuanqi/jsqkexue

上一篇:原生JS实现图片懒加载(lazyload)实例

栏    目:JavaScript代码

下一篇:微信小程序 实例应用(记账)详解

本文标题:js网页版计算器的简单实现

本文地址:http://www.codeinn.net/misctech/218138.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有