Javascript 将多行输入框值添加到总和_Javascript

Javascript 将多行输入框值添加到总和

javascript

Javascript 将多行输入框值添加到总和,javascript,Javascript,我想实现多行，从两个输入框中添加值，并让第三个输入获得这个和值。但现在我只实现了一行。如何设置它以实现多行？是否需要添加遍历函数？谢谢文件 window.onload=函数（）{ var inputs=document.getElementsByTagName（“输入”）；对于（i=0；i您不能使用同一id两次将3个输入字段打包到一个div中循环通过div，子对象应该是 [0]num1 [1] num2 [3] 总数如果您还有其他问题，只需询问这是一个字符串添加，但很容易修复，

我想实现多行，从两个输入框中添加值，并让第三个输入获得这个和值。但现在我只实现了一行。如何设置它以实现多行？是否需要添加遍历函数？谢谢


文件




window.onload=函数（）{
var inputs=document.getElementsByTagName（“输入”）；
对于（i=0；i您不能使用同一id两次
将3个输入字段打包到一个div中
循环通过div，子对象应该是
[0]num1
[1] num2
[3] 总数
如果您还有其他问题，只需询问
这是一个字符串添加，但很容易修复，没有时间进行更多；）

let rows=document.querySelectorAll（“.row”）；
rows.forEach（row=>{
让input=row.querySelector（“input.add”）；
input.addEventListener（“模糊”，（）=>{
row.querySelector（“.result”）.value=parseInt（row.querySelector（“.first”）.value）+parseInt（row.querySelector（“.add”）.value）；
});
})
以下是准确的工作代码：

let rows=document.querySelectorAll（“.row”）；
rows.forEach（row=>{
让input=row.querySelector（“input.add”）；
input.addEventListener（“模糊”，（）=>{
让val1，val2；
if（parseInt（row.querySelector（“.first”）.value））{
val1=parseInt（row.querySelector（“.first”）.value）；
}否则{
val1=0；
//警报（“请在第一个字段中输入一些数字”）；
}
if（parseInt（row.querySelector（“.add”）.value））{
val2=parseInt（row.querySelector（“.add”）.value）；
}否则{
val2=0；
//警报（“请在第二个字段中输入一些数字”）；
}
row.querySelector（“.result”）.value=val1+val2；
});
});
函数和（）{
document.getElementById（“totalSum”）.value=parseInt（document.getElementById（“result1”）.value）+parseInt（document.getElementById（“result2”）.value）；
}

总和
id属性为HTML元素指定一个唯一的id。该值在HTML文档中必须是唯一的。嗨，如果可以的话，你能为我写一个例子吗？我想学习，先学习JSHI！如果可以的话，你能为我写一个例子吗？我想学习，先学习JS来自@VicJordan的代码片段应该可以完成这项工作。写它没有意义增益。嗨，非常有感觉。当我加上时，例如：我加上5，它变成205。而不是25？如何解决它？@adjsn222检查我的答案，我已经解决了。嗨，维克乔丹：现在好了！非常感谢！致以最良好的问候！罗比尼，维克乔丹：我还想问如何添加多个“结果”值添加到单个输入中以获得最终的和。@adjsn222下次读取上面的行，这样您就知道为什么它添加为字符串而不是numberIt's cool。但是，当我双击中间的输入框时，我没有输入内容。当我移动鼠标并单击另一个框时，最右侧的输入框出现错误。您可以试一试吗？请重新输入ds“NaN”错误！@adjsn222修复了该问题。您也可以添加验证。例如，如果任何值为空，则显示警报并要求先填充值。它非常有用！我没有使用stackoverfollow。在查看如何接受答案之前，我已订购了钩子，现在它是绿色的。应该通过。：-DTechnical God！：）
 <!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
</head>
<body>


<input type="text" id="num1" value="20">  
<input type="text" id="num2">  
<input type="text"  value="" id="sum">  <br>

<input type="text" id="num1" value="30">  
<input type="text" id="num2">  
<input type="text"  value="" id="sum">  <br>

<script>  
window.onload = function(){  
    var inputs = document.getElementsByTagName("input");  
    for(i=0;i<inputs.length;i++){  
        inputs[i].onblur = function(){  
            var add1 = document.getElementById("num1").value;  
            var add2 = document.getElementById("num2").value;  
            document.getElementById("sum").value = add1*1 + add2*1;  
        }  
    }  
        }  
</script>  
</body>
</html>