如何将具有不同输入名称的选定复选框相加

Question

我目前有一系列针对不同项目的复选框，选中时会修改总数。 JavaScript代码如下。

<script type="text/javascript"> 
function checkTotal() { 
document.listForm.total.value = ''; 
var sum = 0.00; 
for (i=0;i<document.listForm.choice.length;i++) { 
if (document.listForm.choice[i].checked) { 
sum = sum + parseFloat(document.listForm.choice[i].value); 
} 
} 
document.listForm.total.value = sum.toFixed(2); 
} 

</script> 

此代码工作正常，但所有复选框具有相同的输入名称“选择”。我需要改变它，以便每个输入名称不同，例如choice1，choice2，choice3等。如何更改JavaScript以合并所有不同名称的复选框，而不是仅添加名为“choice”的复选框。

希望得到任何帮助，良好的HTML和CSS知识，但非常基本的JavaScript。谢谢。

Answer 1

使用jQuery，下面的代码片段将添加页面上的所有复选框值。 我没有测试过这个，但它应该可以工作。

$("input[type=checkbox]").each(function(){ 
    if(this.checked){ 
    sum = sum+this.val(); 
    } 
}); 

Answer 2

你可以这样做：

function checkTotal() { 
    document.listForm.total.value = ''; 
    var sum = 0.00; 
    var i, inputs, input; 

    inputs = document.getElementsByTagName('input') 

    for (i=0;i<inputs.length;i++) { 
     input = inputs[i] 
     if (input.type === 'checkbox' && input.name.substr(0, 6) === 'choice') { 
      sum = sum + parseFloat(input.value); 
     } 
    } 
    document.listForm.total.value = sum.toFixed(2); 
} 

这不是测试，但代码看起来应该通过DOM的所有输入元素。然后它将遍历它们并检查那些也是以“choice”开头的复选框。然后它会将复选框的值添加到总和中。

像jQuery这样的库让这类东西变得更容易。