Question

我已经让代码工作了，但是我想知道为什么它只在有多个checkbox命名相同的东西时才有效。我希望每个checkbox拥有自己的名字，但仍然加在一起。任何帮助，将不胜感激。这是我的代码：

function checkTotal() {
    document.listForm.total.value = '';
    var sum = 0;
    for (i=0;i<document.listForm.choicea.length;i++) {
        if (document.listForm.choicea[i].checked) {
            sum = sum + parseInt(document.listForm.choicea[i].value);           
        }
        if (document.listForm.choiceb[i].checked) {
            sum = sum + parseInt(document.listForm.choiceb[i].value);
        }
    }
    document.listForm.total.value = sum;
}


<form name="listForm">
    <input type="checkbox" name="choicea" value="2" onchange="checkTotal()"/>2<br/>
    <input type="checkbox" name="choicea" value="5" onchange="checkTotal()"/>5<br/>
    <input type="checkbox" name="choiceb" value="10" onchange="checkTotal()"/>10<br/>
    <input type="checkbox" name="choiceb" value="20" onchange="checkTotal()"/>20<br/>
    Total: <input type="text" size="2" name="total" value="0"/>
</form>

Answer 1

如果只有一个带有名称的复选框，则JavaScript绑定将不是数组，例如choicea[0]它不会只是choicea。

您可以为每个项目指定相同的类名并使用getElementsByClassName（IE9或更高版本，IE8及以下版本将需要垫片），它总是返回一个项目数组（实际上，HTMLCollection ）。

Answer 2

您在每个实例中使用“choicea”/“choiceb”作为数组。如果每个名称只有一个，则它不是数组。考虑只使用jQuery和输入选择器而不是使用旧的.form.control方法，它可能会更容易。使用$（“myselector”）。每个或类似。如果没有，您可以考虑使用GetElementsByTagName作为替代方案。

一起添加多个复选框

2 个答案: