计算器

最新推荐文章于 2021-05-08 03:59:04 发布

Zyl_CN

最新推荐文章于 2021-05-08 03:59:04 发布

阅读量175

点赞数

分类专栏：小练习

本文链接：https://blog.csdn.net/Zyl_CN/article/details/80494134

版权

小练习专栏收录该内容

32 篇文章 2 订阅

订阅专栏

<body>
<div id="counter">
   <div id="counter_content">
   <h3><input id="input1" type="text" value="0"/></h3>
   <ul>
      <li>7</li>
      <li>8</li>
      <li>9</li>
      <li>+</li>
      <li>4</li>
      <li>5</li>
      <li>6</li>
      <li>-</li>
      <li>1</li>
      <li>2</li>
      <li>3</li>
      <li>×</li>
      <li>0</li>
      <li>C</li>
      <li>=</li>
      <li>÷</li>
   </ul>
   </div>
   <div id="bg"></div>
</div>
</body>

<script>
var bNeedclear = false;//是否清除输入框中已有的内容；
var sOpr = '';//运算符
var sNum1 = '';//代表数字
function calc(iNum1 ,iNum2 , sOpr){
      var iResult = 0;//初始运算结果
      switch (sOpr)
      {
      case "+":
         iResult = iNum1 + iNum2;
         break;
      case "-":
         iResult = iNum1 - iNum2;
         break;
      case "×":
         iResult = iNum1 * iNum2;
         break;
      case "÷":
         iResult = iNum1 / iNum2;
         break;
      default:
         iResult=iNum2;
         break;
      }
      return iResult;
   };//运算方法
function doInput(){//点击按钮功能块
   var onInput = document.getElementById("input1");//通过ID名获取元素节点.
   var sHtml = this.innerHTML;//this代表当前对象 
       switch(sHtml){
      case "="://输出结果
         onInput.value=calc(parseInt(sNum1) , parseInt(onInput.value) ,sOpr );
         sOpr = '';
         sNum1 = '';
         bNeedclear = true;
         break;
      case "+":
      case "-":
      case "×":
      case "÷"://运算符
         bNeedclear = true;
         if (sNum1.length!=0)//数字有内容代表我可以进行计算
         {
                   onInput.value = calc(parseInt(sNum1) , parseInt(onInput.value) ,sOpr);
         }
         sOpr = sHtml;
         sNum1 = onInput.value;
         break;
      case "C":
         onInput.value = "0";
         sNum1 = "";
         sOpr = "";
         break;
      default://数字
         if (bNeedclear)
         {
            onInput.value=parseInt(sHtml,10)//强制取整
            bNeedclear=false;
         }else{
            onInput.value=parseInt(onInput.value+sHtml,10);
         }
         break;
   }
   }
window.onload = function(){
   var aLi = document.getElementsByTagName("li");
   for (var i=0;i<aLi.length ;i++ )//for循环遍历 1.声明一个变量 2.限制条件 3.执行循环语句 
   {
      aLi[i].onmousedown = doInput;
      aLi[i].onmouseover = function(){
         this.className = "active";
      }
      aLi[i].onmouseout = function(){
         this.className = "";
      }
   }
}
   </script>