dafefwr3242 2021-11-02 16:54 采纳率: 100%
浏览 35
已结题

当简单计算器的输入值为空时,如何弹出对话框?

我想给计算器做一个,当输入值都为空时,点击运算符会自动弹出提示对话框的功能,但写完之后发现并没有效果,想请各位帮忙看一下哪里出了问题。

代码:


<!DOCTYPE html>
<html>
 <head>
  <title> A Simple Calculator </title>
   <style>
    p1{
       color: bluck;
       font-family: verdana;
       font-size: 150%;
    }
    body{
      background-color: white;
      size: 100%;
    }
    .all{
       position: absolute;
       top:30%;
       left:35%;
       transition: translateX(-50%) translateY(-50%);
       background-color: lightgrey;
       border: 5px solid green;
    }
   </style>

   <script>
   var N1;
   var N2;
   var sum;

   function checknotnull(id){
     if(document.getElementBy("n1").value=="" && document.getElementBy("n2").value==""){
       return false;
     }else if(document.getElementBy("n1").value=="" && document.getElementBy("n2").value!=""){
       return false;
     }else if(document.getElementBy("n1").value!="" && document.getElementBy("n2").value==""){
       return false;
     }else{
       return true;
     }
   }

   function tishi(){
     if(checknotnull(id) = true){
       calculate();
     }else{
       alert("no");
     }
   }

   function calculate(op){
      N1 = Number(document.getElementById("n1").value);
      N2 = Number(document.getElementById("n2").value);
      sum = document.getElementById("r");
      if(op == '+'){
            sum = N1 * 1 + N2 * 1;
            document.myform.r.value = sum;
      }else if(op == '-'){
            sum = N1 - N2;
            document.myform.r.value = sum;
      }else if(op == '*'){
            sum = N1 * N2;
            document.myform.r.value = sum;
      }else if(op == '/' && N2!= 0){
            sum = N1 / N2;
            document.myform.r.value = sum;
      }
     }
   </script>
 </head>

 <body>
  <div class = "all">
  <p1>A Simple Calculator (client-side JS)</p1>
   <form id = "myform", name = "myform"><br>
    &nbsp;<input type = "number", id = "n1", name = "n1"> First Number <br><br>
    &nbsp;<input type = "number", id = "n2", name = "n2"> Second Number <br><br>
    &nbsp;<input type = "text", id = "r", name = "r"> Result<br><br>
    <table>
     <tr>
       <td> <input type = "button", onclick = "calculate('+')", value = "+", id = "a", name = "a"> </td>
       <td> <input type = "button", onclick = "calculate('-')", value = "-", id = "s", name = "s"> </td>
       <td> <input type = "button", onclick = "calculate('*')", value = "x", id = "m", name = "m"> </td>
       <td> <input type = "button", onclick = "calculate('/')", value = "/", id = "d", name = "d"> </td>
       <td> <input type = "reset", onclick = "alert('The calculate has been reset!')"> </td>
     </tr>
    </table><br>
   </form>
  </div>
 </body>
</html>

  • 写回答

3条回答 默认 最新

  • a5156520 2021-11-02 17:06
    关注

    主要问题是函数调用的顺序没理清,以及一些小的错误,如getElementById少些了个Id。
    修改后代码如下:

     
    <!DOCTYPE html>
    <html>
     <head>
      <title> A Simple Calculator </title>
       <style>
        p1{
           color: bluck;
           font-family: verdana;
           font-size: 150%;
        }
        body{
          background-color: white;
          size: 100%;
        }
        .all{
           position: absolute;
           top:30%;
           left:35%;
           transition: translateX(-50%) translateY(-50%);
           background-color: lightgrey;
           border: 5px solid green;
        }
       </style>
       <script>
       var N1;
       var N2;
       var sum;
       function checknotnull(){
         if(document.getElementById("n1").value=="" && document.getElementById("n2").value==""){
           return false;
         }else if(document.getElementById("n1").value=="" && document.getElementById("n2").value!=""){
           return false;
         }else if(document.getElementById("n1").value!="" && document.getElementById("n2").value==""){
           return false;
         }else{
           return true;
         }
       }
       function tishi(op){
         if(checknotnull() == true){
           calculate(op);
         }else{
           alert("no");
         }
       }
       function calculate(op){
          N1 = Number(document.getElementById("n1").value);
          N2 = Number(document.getElementById("n2").value);
          sum = document.getElementById("r");
          
          if(op == '+'){
                sum = N1 * 1 + N2 * 1;
                document.myform.r.value = sum;
          }else if(op == '-'){
                sum = N1 - N2;
                document.myform.r.value = sum;
          }else if(op == '*'){
                sum = N1 * N2;
                document.myform.r.value = sum;
          }else if(op == '/' && N2!= 0){
                sum = N1 / N2;
                document.myform.r.value = sum;
          }
          
         }
       </script>
     </head>
     <body>
      <div class = "all">
      <p1>A Simple Calculator (client-side JS)</p1>
       <form id = "myform", name = "myform"><br>
        &nbsp;<input type = "number", id = "n1", name = "n1"> First Number <br><br>
        &nbsp;<input type = "number", id = "n2", name = "n2"> Second Number <br><br>
        &nbsp;<input type = "text", id = "r", name = "r"> Result<br><br>
        <table>
         <tr>
           <td> <input type = "button", onclick = "tishi('+')", value = "+", id = "a", name = "a"> </td>
           <td> <input type = "button", onclick = "tishi('-')", value = "-", id = "s", name = "s"> </td>
           <td> <input type = "button", onclick = "tishi('*')", value = "x", id = "m", name = "m"> </td>
           <td> <input type = "button", onclick = "tishi('/')", value = "/", id = "d", name = "d"> </td>
           <td> <input type = "reset", onclick = "alert('The calculate has been reset!')"> </td>
         </tr>
        </table><br>
       </form>
      </div>
     </body>
    </html>
     
    
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题?

问题事件

  • 系统已结题 11月10日
  • 已采纳回答 11月2日
  • 创建了问题 11月2日

悬赏问题

  • ¥100 微信小程序跑脚本授权的问题
  • ¥100 房产抖音小程序苹果搜不到安卓可以付费悬赏
  • ¥15 STM32串口接收问题
  • ¥15 腾讯IOA系统怎么在文件夹里修改办公网络的连接
  • ¥15 filenotfounderror:文件是存在的,权限也给了,但还一直报错
  • ¥15 MATLAB和mosek的求解问题
  • ¥20 修改中兴光猫sn的时候提示失败
  • ¥15 java大作业爬取网页
  • ¥15 怎么获取欧易的btc永续合约和交割合约的5m级的历史数据用来回测套利策略?
  • ¥15 有没有办法利用libusb读取usb设备数据