doubeng9567 2019-05-07 06:31
浏览 90
已采纳

如何在第三个输入框中添加两个输入值并显示? 用这样简单的JavaScript帮助我在哪里错了[重复]

This question already has an answer here:

1)I want to add the values of two input boxes and show it in the third input. It shows an error

2)Error: Uncaught TypeError: Cannot read property 'value' of null at sum (js.php:21) at HTMLButtonElement.onclick (js.php:12)

<!DOCTYPE html>
<html>

  <head>
    <title>JavaScript</title>
    <script type="text/javascript">
      function sum() {
        var val1 = document.getElementById('val1').value;
        var val2 = document.getElementById('val2').value;
        var sum = val1 + val1;
        document.getElementById('total').value = sum;
      }

    </script>
  </head>

  <body>
    <input type="text" name="val1"><br><br>
    <input type="text" name="val2"><br><br>
    <input disabled name="total" value=""><br><br>
    <button type="button" onclick="sum()" name="btn">Add</button>
  </body>

</html>

I expected the sum of two inputs but it shows nothing.

</div>
  • 写回答

7条回答 默认 最新

  • doumicheng6732 2019-05-07 06:36
    关注

    You should have the attribute id for the controls which you are referencing in your code with getElementById(). You also have to convert the string value to number to perform the arithmetic operation:

    function sum(){
      var val1 = document.getElementById('val1').value;
      var val2 = document.getElementById('val2').value;
      var sum = Number(val1) + Number(val2);
      document.getElementById('total').value = sum;
    }
    <input type="text" name="val1" id="val1"><br><br>
    <input type="text" name="val2" id="val2"><br><br>
    <input name="total" id="total" value=""><br><br>
    <button type="button" onclick="sum()" name="btn">Add</button>

    </div>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(6条)

报告相同问题?

悬赏问题

  • ¥15 TI的insta-spin例程
  • ¥15 完成下列问题完成下列问题
  • ¥15 C#算法问题, 不知道怎么处理这个数据的转换
  • ¥15 YoloV5 第三方库的版本对照问题
  • ¥15 请完成下列相关问题!
  • ¥15 drone 推送镜像时候 purge: true 推送完毕后没有删除对应的镜像,手动拷贝到服务器执行结果正确在样才能让指令自动执行成功删除对应镜像,如何解决?
  • ¥15 求daily translation(DT)偏差订正方法的代码
  • ¥15 js调用html页面需要隐藏某个按钮
  • ¥15 ads仿真结果在圆图上是怎么读数的
  • ¥20 Cotex M3的调试和程序执行方式是什么样的?