JS 学习计算器编写

最新推荐文章于 2022-07-01 09:28:37 发布

sxluohaibo

最新推荐文章于 2022-07-01 09:28:37 发布

阅读量409

点赞数 1

文章标签： javascript html

本文链接：https://blog.csdn.net/sxluohaibo/article/details/51505458

版权

<!DOCTYPE html>
<html>
    <head>
      <meta charset="utf-8">
      <title>calculator</title>

      <script >
      //清除文本框的值
      var currentNum; //符号点击前保存的数值
      var operation;
      var specialClickOption = 0;
      var isToNew = 1;
      function NumberClear() {
        var numbertext = document.getElementById('numberMessage');
        currentNum = 0; //符号点击前保存的数值
        operation = 0;
        specialClickOption = 0;
        numbertext.value="";
        isToNew = 1;
      }

      function NumberClick(num){ // 0-9 普通的数字点击
        if(num==-1)
          num=".";
        var btn = document.getElementById('NumberBtn');
        var numbertext = document.getElementById('numberMessage');
        if (isToNew == 1) {
          numbertext.value = numbertext.value + num;
        }else {
          isToNew = 1;
          numbertext.value = num;
        }
      }

      function SpecialClick(sp){ //＋－＊／运算符点击
        var numbertext = document.getElementById('numberMessage');
        var cuValue = numbertext.value;
        currentNum = parseFloat(cuValue);
        console.log(currentNum);
        numbertext.value = "";
        operation = sp;
      }

      function LastResult(){ //＝等号点击
          var numbertext = document.getElementById('numberMessage');
          isToNew = 0;
          switch (operation) {
            case '+':
              numbertext.value = String(parseInt(numbertext.value) + currentNum);
              break;
            case '-':
              numbertext.value = String(currentNum - parseInt(numbertext.value));
              break;
            case '*':
              numbertext.value = (numbertext.value * currentNum).toFixed(2);
              break;
            case '/':
              numbertext.value = (currentNum / numbertext.value).toFixed(2);
              break;
            default:

          }
      }

      function FetchQuYU(){ //取余
          var numbertext = document.getElementById('numberMessage');
          numbertext.value = numbertext.value / 100;
      }

      function SpecialPlusAndJ(){

          console.log("xxxxx");
          var numbertext = document.getElementById('numberMessage');
          if (specialClickOption == 0) {
              numbertext.value = '-' + numbertext.value;
              specialClickOption = 1;
          }else {
            console.log(numbertext.value);
            numbertext.value = numbertext.value.substring(1,numbertext.value.length-1);
            specialClickOption = 0;
          }

      }

      </script>
    </head>
    <body bgcolor="affff" >
      <table border="1" align="center" >
        <tr align="center">
          <td>
          <input type="text" id="numberMessage" style="height:40px; width:120px">
        </td>
        </tr>

        <tr>
          <td>
          <input type="button" id="Special" value="AC" οnclick="NumberClear()">
          <input type="button" id="Special" value="+/-" οnclick="SpecialPlusAndJ()">
          <input type="button" id="Special" value="%" οnclick="FetchQuYU()">
          <input type="button" id="Special" value="/" οnclick="SpecialClick('/')">
        </td>
        </tr>

        <tr>
          <td>
          <input type="button" id="NumberBtn" value="7" οnclick="NumberClick(7)">
          <input type="button" id="NumberBtn" value="8" οnclick="NumberClick(8)">
          <input type="button" id="NumberBtn" value="9" οnclick="NumberClick(9)">
          <input type="button" id="NumberBtn" value="*" οnclick="SpecialClick('*')">
        </td>
        </tr>
        <tr>
          <td>
          <input type="button" id="NumberBtn" value="4" οnclick="NumberClick(4)">
          <input type="button" id="NumberBtn" value="5" οnclick="NumberClick(5)">
          <input type="button" id="NumberBtn" value="6" οnclick="NumberClick(6)">
          <input type="button" id="-" value="-" οnclick="SpecialClick('-')">
          </td>
        </tr>
        <tr>
          <td>
          <input type="button" id="NumberBtn" value="1" οnclick="NumberClick(1)">
          <input type="button" id="NumberBtn" value="2" οnclick="NumberClick(2)">
          <input type="button" id="NumberBtn" value="3" οnclick="NumberClick(3)">
          <input type="button" id="*" value="+" οnclick="SpecialClick('+')">
          </td>
        </tr>
        <tr>
          <td>
          <input type="button" id="0" value="0" οnclick="NumberClick(0)">
          <input type="button" id="NumberBtn" value="." οnclick="NumberClick(-1)">
          <input type="button" id="=" value="=" οnclick="LastResult()">

          </td>
        </tr>
      </table>

    </body>
</html>

sxluohaibo

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS 学习计算器编写

calculator //清除文本框的值 var currentNum; //符号点击前保存的数值 var operation; var specialClickOption = 0; var isToNew = 1; function NumberClear() { var
复制链接

扫一扫