我的脚本中有一个小问题,我无法获得超过9个输入的总和。
最多9个工作正常,但如果你添加一个新的输入字段,这将停止工作。
Div输入和按钮:
<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>
答案 0 :(得分: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”作为第十个索引,这可能是你原本想要的。
你可以为更大数量或其他情况做类似的工作。对于更通用的解决方案,您可以使用函数pad the string to a given size
答案 1 :(得分:3)
你是如何命名的?
我猜您使用的是value10
,但您的getValues代码会将i追加到value0
。我敢打赌如果你使用value010
,它会起作用。
如果下一个值必须是value10,您有两个选择:
1。)将value01
重命名为value09
至value1
至value9
2。)仅在i <1时附加0。 10:
for(var i=1; i <= max; i++){
parseFloat(getValues("value" + ((i<10)? "0" + i : i)));
}
答案 2 :(得分:3)
您的代码说
getValues("value0" + i)
因此对于i的值> 9,它将寻找ID“value010”等。所以如果你的附加输入有像
这样的ID<input type="text" id="value10" />
然后“value010”将与“value10”不匹配,您将无法找到您要找的内容。