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日

悬赏问题

  • ¥15 乌班图ip地址配置及远程SSH
  • ¥15 怎么让点阵屏显示静态爱心，用keiluVision5写出让点阵屏显示静态爱心的代码，越快越好
  • ¥15 PSPICE制作一个加法器
  • ¥15 javaweb项目无法正常跳转
  • ¥15 VMBox虚拟机无法访问
  • ¥15 skd显示找不到头文件
  • ¥15 机器视觉中图片中长度与真实长度的关系
  • ¥15 fastreport table 怎么只让每页的最下面和最顶部有横线
  • ¥15 java 的protected权限 ，问题在注释里
  • ¥15 这个是哪里有问题啊？