多复选框javascript检查状态检测

所以基本上我的页面上有一堆复选框：

<input type="checkbox" id="check" name="1">
<input type="checkbox" id="check" name="2">
<input type="checkbox" id="check" name="3">

---

但这只处理一个复选框，如果我有多个类似于上面的复选框，则不起作用。我可能会有很多，所以我不想一个接一个地检查它们，任何帮助都将不胜感激，谢谢大家

您正在使用id绑定click，并且所有三个控件都具有相同的id。您需要为html控件指定唯一的id，最好指定一个公共类来对它们进行分组。我已经更改了复选框的ID以使其唯一

<input type="checkbox" id="check1" name="1" class="someclass">
<input type="checkbox" id="check2" name="2" class="someclass">
<input type="checkbox" id="check3" name="3" class="someclass">


$('.someclass').click(function()...

在更改其他复选框时选中一组复选框

<input type="checkbox" id="check1" name="1" class="someclass">
<input type="checkbox" id="check2" name="2" class="someclass">
<input type="checkbox" id="check3" name="3" class="someclass">
<label> <input id="chkall" type="checkbox" text=""aa /> check all </label>
​

$('#chkall').click(function() {
    $('.someclass').attr('checked', this.checked);
});​

全部检查
​
$（'#chkall'）。单击（函数（）{
$（'.someclass'）.attr（'checked'，this.checked）；
});​

您正在使用id绑定click，并且所有三个控件都具有相同的id。您需要为html控件指定唯一的id，最好指定一个公共类来对它们进行分组。我已经更改了复选框的ID以使其唯一

<input type="checkbox" id="check1" name="1" class="someclass">
<input type="checkbox" id="check2" name="2" class="someclass">
<input type="checkbox" id="check3" name="3" class="someclass">


$('.someclass').click(function()...

在更改其他复选框时选中一组复选框

<input type="checkbox" id="check1" name="1" class="someclass">
<input type="checkbox" id="check2" name="2" class="someclass">
<input type="checkbox" id="check3" name="3" class="someclass">
<label> <input id="chkall" type="checkbox" text=""aa /> check all </label>
​

$('#chkall').click(function() {
    $('.someclass').attr('checked', this.checked);
});​

全部检查
​
$（'#chkall'）。单击（函数（）{
$（'.someclass'）.attr（'checked'，this.checked）；
});​

但这只处理一个复选框，如果我有更多复选框，则不起作用 比上面那样的好

这是因为当使用id选择器时，jQuery只返回它找到的第一个元素。 ID应该是唯一的

根据：

每个id值在文档中只能使用一次。如果超过 一个元素被分配了相同的ID，即使用该ID的查询 将仅选择DOM中第一个匹配的元素。这种行为 然而，不应依赖于；包含多个文档的文档 使用相同ID的元素无效

如果需要对元素进行分组，可以指定一个类：

<input type="checkbox" id="check1" class="checkbox-group1">
<input type="checkbox" id="check2" class="checkbox-group1">
<input type="checkbox" id="check3" class="checkbox-group1">

也可以使用数据属性：

<input type="checkbox" id="check1" data-group="checkbox-group1">
<input type="checkbox" id="check2" data-group="checkbox-group1">
<input type="checkbox" id="check3" data-group="checkbox-group1">

但这只处理一个复选框，如果我有更多复选框，则不起作用 比上面那样的好

这是因为当使用id选择器时，jQuery只返回它找到的第一个元素。 ID应该是唯一的

根据：

每个id值在文档中只能使用一次。如果超过 一个元素被分配了相同的ID，即使用该ID的查询 将仅选择DOM中第一个匹配的元素。这种行为 然而，不应依赖于；包含多个文档的文档 使用相同ID的元素无效

如果需要对元素进行分组，可以指定一个类：

<input type="checkbox" id="check1" class="checkbox-group1">
<input type="checkbox" id="check2" class="checkbox-group1">
<input type="checkbox" id="check3" class="checkbox-group1">

也可以使用数据属性：

<input type="checkbox" id="check1" data-group="checkbox-group1">
<input type="checkbox" id="check2" data-group="checkbox-group1">
<input type="checkbox" id="check3" data-group="checkbox-group1">

标记无效（正如a所告诉您的）：文档中的

id

属性值必须是唯一的。对于复选框，

id

属性主要用于将控件与其标签相关联，如在

Sugar

中

因此，您需要其他内容来引用您的复选框。要引用页面上的所有复选框，可以使用

$（'input[type=checkbox]'）

。但是，如果您希望以某种方式处理一组特定的复选框，最自然的方式可能是在它们中使用相同的

name

属性，例如

<input type="checkbox" name="addon" value="sugar">
<input type="checkbox" name="addon" value="cream">
<input type="checkbox" name="addon" value="milk">

并使用

$（'[name=addon]'）

。请注意，在这种方法中，提交的数据将包含addon=sugar、addon=cream等字段，而不是像1=on、2=on等字段。这是使用

name

而不使用

value

得到的。标记无效（正如a会告诉您的那样）：

id

属性值在文档中必须是唯一的。对于复选框，

id

属性主要用于将控件与其标签相关联，如在

Sugar

中

因此，您需要其他内容来引用您的复选框。要引用页面上的所有复选框，可以使用

$（'input[type=checkbox]'）

。但是，如果您希望以某种方式处理一组特定的复选框，最自然的方式可能是在它们中使用相同的

name

属性，例如

<input type="checkbox" name="addon" value="sugar">
<input type="checkbox" name="addon" value="cream">
<input type="checkbox" name="addon" value="milk">

---

并使用

$（'[name=addon]'）

。注意，在这种方法中，提交的数据将包含像addon=sugar、addon=cream等字段，而不是像1=on、2=on等字段。这是使用

name

而不使用

value

得到的，请参见下面的链接…参见下面的链接…太棒了！谢谢：D一个简单的问题，我使用document.getElementById（“”）.innerHTML+=创建复选框，但是它们不工作，常规html工作，但是那些不工作，它们也破坏了其他的复选框，你知道为什么吗？你可能必须重新绑定单击侦听器。绑定后创建的新元素将不会绑定到，即使它们共享同一个类。这太棒了！谢谢：D一个简单的问题，我使用document.getElementById（“”）.innerHTML+=创建复选框，但是它们不工作，常规html工作，但是那些不工作，它们也破坏了其他的复选框，你知道为什么吗？你可能必须重新绑定单击侦听器。绑定后创建的新元素将不会绑定到，即使它们共享同一个类。