不能超过9输入javascript

Question

我的脚本中有一个小问题,我无法获得超过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>

Answer 1

请注意,在您的代码中,您明确在索引之前添加"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"作为第十个索引,这可能是你原本想要的.

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