Question

我是javascript和新手程序员的新手，所以这可能是一个非常容易回答的问题。我想循环遍历x个字段的值并将它们相加以在最终字段中显示总和。如果我明确地调用每个字段，我可以执行此功能，但我想抽象它，以便我可以处理灵活的字段数。这是我提出的示例代码（这对我不起作用）。我哪里错了？

<html>
<head>
<script type="text/javascript">
function startAdd(){
    interval = setInterval("addfields()",1);
}
function addfields(){
    a = document.addition.total.value;
    b = getElementByTagName("sum").value;
    for (i=0; i<=b.length; i++){
        a+=i;
    }
    return a;
}
function stopAdd(){
    clearInterval(interval);
}
</script>
</head>

<body>

<form name="addition">

 <input type="text" name="sum" onFocus="startAdd();" onBlur="stopAdd;">
+ <input type="text" name="sum" onFocus="startAdd();" onBlur="stopAdd;">
= <input type="text" name ="total">

</form>

</body>
</html>

Answer 1

您的代码有两个问题。

第一个：

b = getElementByTagName("sum").value;

你可能意味着getElementsByTagName（注意额外的s）。此外，没有<sum>元素，这是一个问题，因为你不会得到任何结果。最后，.value将返回数组的value属性（因为不存在，您将返回undefined），而不是value属性的数组每个元素。

要解决这些问题，您可以这样写：

inputElements = getElementsByTagName('input');
sumValues = [ ];

for(i = 0; i < inputElements.length; ++i) {
    if(inputElements[i].name == 'sum') {
        sumValues.push(inputElements[i].value);
    }
}

或者在jQuery中：

sumValues = $('input[name=sum]').map(function() {
    return this.value;
});

第二个：

for (i=0; i<=b.length; i++){

b.length描述了元素的数量。使用<=，您将访问不存在的b[b.length]。您最多可以访问b[b.length - 1]，因此最常用的方法是重写条件以使用<代替<=。那就是：

for(i = 0; i < b.length; ++i) {

Answer 2

您的代码中没有名为“sum”的标记。我建议在输入标签上使用class属性，然后使用getElementsByTagName('input')并检查它们是否具有相关的类。 jQuery会极大地简化这一过程，因为您可以在一行中选择具有特定类的所有元素：$(".className")。如果你不想要jQuery，可能会感兴趣this question。

Answer 3

我会使用jQuery库并进行模式匹配以获取要添加的所有元素，然后将其放在输出字段中

使用javascript添加不确定数量的字段

3 个答案: