【javascript学习指南】JavaScript实现的超简单计算器功能示例

更新时间:2024-03-24    来源:js教程    手机版     字体:

【www.bbyears.com--js教程】

本文实例讲述了JavaScript实现的超简单计算器功能。分享给大家供大家参考,具体如下:

先来看看运行效果:

具体代码:




  
  www.jb51.net JS计算器
  <script type="text/javascript">
   // window.onload 获取元素getElementById
    window.onload = function(){
      var oTxt1 = document.getElementById("val01");
      var oTxt2 = document.getElementById("val02");
      var oFuhao = document.getElementById("fuhao");
      // 这三个要放在button函数里面,因为s1.value是获取input里面的输入,但是这个时候还没有输入了
      // var iNum1 = oTxt1.value;
      // var iNum2 = oTxt2.value;
      // var iNum3 = oFuhao.value;
      oBtn = document.getElementById("btn");
       // 计算按钮点击事件
      oBtn.onclick = function(){
        var iNum1 = oTxt1.value;
        var iNum2 = oTxt2.value;
        var iNum3 = oFuhao.value;
        var iResult;
          //如果两个输入有一个是空的话          //return是让if里面执行结束
        if (iNum1=="" || iNum2=="") {
          alert("不能为空");
          return;
        }          //isNaN() 如果是true,说明是非数字,所以如果两个输入中有非数字,就提示alert
        if (isNaN(iNum1) || isNaN(iNum2)) {
          alert("不能有字母");
          return;
        }          //对+-*/四个操作对应的value进行判断          //如果直接iNum1+iNum2 输出的结果是字符串的拼接 12+24 1224 所以要转换成parseInt整数
        if (iNum3 == 0) {
          iResult = parseInt(iNum1) + parseInt(iNum2)
        }
        else if (iNum3 == 1) {
          iResult = parseInt(iNum1) - parseInt(iNum2)
        }
        else if (iNum3 == 2) {
          iResult = parseInt(iNum1) * parseInt(iNum2)
        }
        else if (iNum3 == 3) {
          iResult = parseInt(iNum1)/parseInt(iNum2)
        }
        alert(iResult);
      }
    }
  </script>


  

计算器

本文来源:http://www.bbyears.com/wangyezhizuo/144018.html

热门标签

更多>>

本类排行