javascript - 添加三个数字并使用 Javascript 在文本框中显示结果

标签 javascript html

我只是想写一个代码,它将使用 3 个输入字段并将它们的总和显示到结果字段中。如果有人将数据放在字段 1 中,结果字段应显示结果字段中的数据,当用户将数据放在第二个字段中时,结果字段应显示字段 1 和字段 2 的总和,当用户将数据放入字段 3 时,他们的数据总和应显示在结果字段中。我写了下面的代码但没有取得任何成功。我是新手。

<body>
Field 1: <input type="text" id="num1" onkeyup="sum();" > </br>
Field 2: <input type="text" id="num2" onkeyup="sum();" > </br>
Field 3: <input type="text" id="num3" onkeyup="sum();"> </br>
Sum: <input type="text" id="final"  />



<script type="text/javascript">

function sum()
{


var w = document.getElementById('num1').value;

var x = document.getElementById('num2').value;

var y = document.getElementById('num3').value;

var z=parseInt(w)+parseInt(x)+parseInt(y);


document.getElementByID('final').value=z;

}       
</script>

</body>

最佳答案

两个问题:

(1) 最后一行中的小错别字,您使用的是 getElementByID 而不是 getElementById

(2) 您需要考虑没有值的情况,一种方法是用 0 或它(如果没有值,则计算结果为 0)。

这是一个工作示例:

function sum()
{
  var w = document.getElementById('num1').value || 0;
  var x = document.getElementById('num2').value || 0;
  var y = document.getElementById('num3').value || 0;

  var z=parseInt(w)+parseInt(x)+parseInt(y);

  document.getElementById('final').value=z;
};   

https://jsfiddle.net/yq60qad0/

关于javascript - 添加三个数字并使用 Javascript 在文本框中显示结果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41915245/

相关文章:

html - Internet Explorer 7 错误

html - CSS 媒体查询移动与桌面 : Mobile too zoomed out | Materialize

javascript - 使整个元素可拖动,但不是所有元素都会导致拖动

javascript - 三个js,获取pointerlockcontrols面向的vector3

css - 如何将两个 div 并排放置,其中一个在两个 div 的容器中居中

javascript - 全 Angular 元素的循环视差效果在 CSS/JS 中不断跳跃

javascript - 在 Flot 中指定自定义数据点

javascript - 具有动态宽度的 Jssor Slider 固定高度

javascript - 通过 AJAX 和 PHP 传递 Canvas 图像 dataURL 进行解码并保存在服务器端

Javafx 2.0 Applet安全提示时,如何自定义空Applet区域的背景?