如何计算表单中的所有复选框（Javascript）

我有许多动态生成的复选框。所以我不知道每次会生成多少个复选框。我需要一些 JavaScript 方法来计算表单中复选框的总数。

 <input type="checkbox" value="username1" name="check[0]" id="1" /><br/>
 <input type="checkbox" value="userusername2" name="check[1]" id="1" /><br/>
 <input type="checkbox" value="userusername3" name="check[2]" id="1" /><br/>

我无法更改复选框的名称，因为我需要将值作为数组发送到服务器端 PHP 脚本。

由于所有其他答案都是基于 jquery 的，因此我将提供纯 JavaScript 解决方案。假设以下形式：

<form id="myform">
    <input type="checkbox" value="username1" name="check[0]" /><br/>
    <input type="checkbox" value="userusername2" name="check[1]" /><br/>
    <input type="checkbox" value="userusername3" name="check[2]" /><br/>
</form>

您可以使用以下逻辑计算复选框元素的数量：

<script type="text/javascript">
var myform = document.getElementById('myform');
var inputTags = myform.getElementsByTagName('input');
var checkboxCount = 0;
for (var i=0, length = inputTags.length; i<length; i++) {
     if (inputTags[i].type == 'checkbox') {
         checkboxCount++;
     }
}
alert(checkboxCount);
</script>

顺便说一句：正如其他人指出的那样，id任何 HTML 标记中的属性在文档中应该是唯一的。我省略了你的id="1"上面的 HTML 示例中的属性。

Update:

如果您只是想计算整个页面上的所有复选框元素而不使用包含表单元素，那么这应该可行：

<script type="text/javascript">
var inputTags = document.getElementsByTagName('input');
var checkboxCount = 0;
for (var i=0, length = inputTags.length; i<length; i++) {
     if (inputTags[i].type == 'checkbox') {
         checkboxCount++;
     }
}
alert(checkboxCount);
</script>