在jQuery中选择

请参见以下标记

<div style="width: 30%;">
    <asp:Repeater ID="rptParent" runat="server" OnItemDataBound="rptParent_ItemDataBound">
        <ItemTemplate>
            <table id="tblRoleHdr" style="border-style: solid; border-width: 1px;
                border-color: Red;">
                <tr>
                    <td style="width: 1%;">
                        <asp:CheckBox ID="chkRoleHdr" runat="server" />
                    </td>
                    <td style="width: 50%;">
                        <asp:HiddenField ID="hidRoleID" runat="server" Value='<%#Eval("RoleID") %>' />
                        <asp:Label ID="lblRole" runat="server" Text='<%#Eval("Role") %>'></asp:Label>
                    </td>
                    <td style="width: 1%;">
                        <asp:CheckBox ID="chkP1Hdr" runat="server" CssClass="chkP1Hdr" />
                    </td>
                    <td style="width: 1%;">
                        <asp:CheckBox ID="chkP2Hdr" runat="server"  CssClass="chkP2Hdr" />
                    </td>
                    <td style="width: 1%;">
                        <asp:CheckBox ID="chkP3Hdr" runat="server"  CssClass="chkP3Hdr" />
                    </td>
                </tr>
            </table>
            <asp:Repeater ID="rptChild" runat="server">
                <HeaderTemplate>
                    <table id="tblChild" class="tblChild" style="border-style: solid; border-width: 1px;
                border-color:Green;">
                </HeaderTemplate>
                <ItemTemplate>
                    <tr>
                        <td style="width: 1%;">
                            &nbsp;&nbsp;&nbsp;&nbsp;
                        </td>
                        <td style="width: 50%;">
                            <asp:HiddenField ID="hidUserID" runat="server" Value='<%#Eval("UserID") %>' />
                            <asp:Label ID="lblUser" runat="server" Text='<%#Eval("User") %>'></asp:Label>
                        </td>
                        <td style="width: 1%;">
                            <asp:CheckBox ID="chkP1Child" runat="server" CssClass="chkP1Child" />
                        </td>
                        <td style="width: 1%;">
                            <asp:CheckBox ID="chkP2Child" runat="server" CssClass="chkP2Child"/>
                        </td>
                        <td style="width: 1%;">
                            <asp:CheckBox ID="chkP3Child" runat="server" CssClass="chkP3Child" />
                        </td>
                    </tr>
                </ItemTemplate>
                <FooterTemplate>
                    </table>
                </FooterTemplate>
            </asp:Repeater>
        </ItemTemplate>
        <SeparatorTemplate>
            <hr />
        </SeparatorTemplate>
    </asp:Repeater>
</div>

它将生成以下输出

在jQuery中我需要做的是

如果单击红色标记的复选框，则属于该组的所有复选框都将被选中

如果选中蓝色标题复选框，则列中的所有复选框都将被选中

其余两个复选框的步骤2

---

请您查看我为复选框指定的类。如何使用jQuery完成任务

这应该可以让你开始了。这将侦听任何检查过的支票盒。如果该复选框具有类chkP1Hdr，并且已选中，则它将选中所有chkP1Child子项

$("input[type='checkbox']").change(function () {
    if ($(this).hasClass("chkP1Hdr") && this.checked)
        $(".chkP1Child").attr("checked", true);
    if ($(this).hasClass("chkP2Hdr") && this.checked)
        $(".chkP2Child").attr("checked", true);
    if ($(this).hasClass("chkP3Hdr") && this.checked)
        $(".chkP3Child").attr("checked", true);
});

---

以此类推，对于2和3，如果可以稍微更改标记，可以使用一些额外的类和数据属性来获得想要的效果。首先，每个需要由组/列自动选择的复选框都需要一个组级和/或列级类。例如：

<input type="checkbox" class="groupA column3" />

---

您可以在中看到一个工作示例。

不要使用

$（this）.attr（“checked”）

获取

checked

属性的当前状态。改用

这个。选中
，因为它避免了额外的开销。另外，
attr（）
实际上并没有提供属性，而是提供属性值，因此如果要使用jQuery，
.prop（）
更合适。他们试图更正
1.6
中的
.attr（）
方法，以便它只适当地处理属性，但为时已晚，因此，由于大量代码被破坏，他们立即回滚了
1.6.1
@RightSaidFred中的大部分更改-我切换了它，谢谢。我可以理解为什么这个.checked可以避免开销，但是你能解释一下你所说的
不是真正给你属性，而是属性值吗？属性值不是我想要的吗？我不想检查已检查属性值的真实值吗？@RightSaidFred-抱歉，再仔细想想……已检查属性值和已检查属性之间有什么区别？后者不控制前者吗？关于你的第一个评论，是的，你想要选中的属性。这是我用
attr（）
方法解释问题的笨拙过渡。我的观点是，
attr（）
看起来像是在给你属性，但有时它会给你属性。如果选择“否”，则属性更改时，属性保持不变。因此它与ID属性/属性不同@RightSaidFred-如果属性在更改时保持不变，我想这就是您说使用
this.checked
读取值的原因之一。因为那永远是对的。另外，我是否正确理解要更改选中的属性，您应该使用attr函数，以便属性和属性都正确？为什么我得到两个否决票…所有项目都是动态创建的。我不能硬编码“GroupA”，比如。。？
<input type="checkbox" class="groupHeading" data-group="GroupA" />
<input type="checkbox" class="columnHeading" data-group="GroupA" data-column="Column3" />

// Handle group heading change
$('.groupHeading').change(function () {
  // Set checked state to all checkboxes with class matching data-group
  $('.'+$(this).data('group')).attr('checked', $(this).is(':checked'));
});

// Handle column heading change
$('.columnHeading').change(function () {
  // Set checked state to all checkboxes with class matching data-group and data-column
  $('.'+$(this).data('group')+'.'+$(this).data('column')).attr('checked', $(this).is(':checked'));
});