0

我的脚本中有一个小问题，我无法获得超过 9 个输入的总和。

最多 9 个工作正常，但如果您添加一个新的输入字段，这将停止工作。

Div whit 输入和按钮：

<div id="valuesContainer">
<input type="text" id="value01" />
<input type="text" id="value02" />
<input type="text" id="value03" />
<input type="text" id="value04" />
<input type="text" id="value05" />
<input type="text" id="value06" />
<input type="text" id="value07" />
<input type="text" id="value08" />
<input type="text" id="value09" />

</div>
<input type="button" value="Add Value" id="addMore" onclick="addInput();" />
<input type="button" value="Calculate Total" onclick="getTotal();" />
<div id="total"></div>

Javascript 使用函数进行求和以添加新的输入字段。

    <script type="text/javascript">
var max = 9;

function getValues(id){
    var result = document.getElementById(id).value;
    return (result ? result : 0);
}

function addInput(){
    max++;
    var input = '<input type="text" id="value'+ max +'" />';
    document.getElementById("valuesContainer").innerHTML += input;
}

function getTotal(){
    var sum = 0;
    for(var i=1; i <= max; i++){
        sum = sum + parseFloat(getValues("value0" + i));
    }
    document.getElementById("total").innerHTML = sum;
}
    </script>
4

3 回答 3

8

请注意，在您的代码中，您在以下索引之前明确添加了“value0”：

sum = sum + parseFloat(getValues("value0" + i));

使用该代码，您的第十个索引应该是“value010”

仅当索引小于 10 时，您才可以在前面添加“0”：

if (i < 10)
   sum = sum + parseFloat(getValues("value0" + i)); 
else
   sum = sum + parseFloat(getValues("value" + i));

然后你可以对第十个索引使用“value10”，这可能是你最初想要的。

您可以为更大的数量或其他情况做类似的工作。对于更通用的解决方案，您可以使用函数将字符串填充到给定大小

于 2013-01-20T02:45:48.380 回答
3

你如何命名它们？

我的猜测是您正在使用value10，但您的 getValues 代码将 i 附加到value0. 我敢打赌，如果您使用value010，它会起作用。

如果下一个值必须是 value10，您有两种选择：

1.) 将 through 重value01命名value09为value1throughvalue9

2.) 仅在 i < 10 时附加 0：

for(var i=1; i <= max; i++){
     parseFloat(getValues("value" + ((i<10)? "0" + i : i)));
}
于 2013-01-20T02:46:28.553 回答
3

你的代码说

getValues("value0" + i)

因此对于 i > 9 的值，它将查找 ID“value010”等。因此，如果您的其他输入具有类似的 ID

<input type="text" id="value10" />

那么“value010”将与“value10”不匹配，您将找不到您要查找的内容。

于 2013-01-20T02:46:47.960 回答