Jquery：如何选中/取消选中复选框单击复选框列表

Question

我需要在点击批准复选框标题时取消选中所有拒绝复选框，反之亦然。如何使用jquery / javascript实现此目的。

我的HTML代码如下

 <asp:TemplateField >
        <HeaderTemplate>
            Approve
            <br />
            <input id="ChkAllApprovedItems"  type="checkbox"  />
        </HeaderTemplate>
        <ItemTemplate>
            <asp:CheckBox ID="chkApproval" Checked='<%#Eval("IsApproved").ToString()=="1"?true:false %>'  runat="server" onclick="EnableApprove(this,this.checked);" />
         </ItemTemplate>
    </asp:TemplateField>

     <asp:TemplateField >
        <HeaderTemplate>
            Reject
            <br />
            <input id="ChkAllRejectedItems"  type="checkbox"  />
        </HeaderTemplate>
        <ItemTemplate>
            <asp:CheckBox ID="chkReject" Checked='<%#Eval("IsRejected").ToString()=="1"?true:false %>'  runat="server"  onclick="EnableReject(this,this.checked);" />
         </ItemTemplate>
    </asp:TemplateField>

有人可以帮我提供示例代码。

感谢。

Answer 1

这是一个非常简单的例子：

http://jsfiddle.net/ZcFda/2/

• 将所有接受和拒绝复选框全部放入两个数组
• 将“点击”事件绑定到两个标题复选框
• 点击标题后，查看点击是否导致其“已检查”
• 如果是，请循环选中相应的复选框并设置checked = false

Answer 2

您可以根据主复选框更改其他复选框属性。 JS Fiddle

$("#master_checkbox").change(function(){
    // if checkbox is checked then chek all
    if($(this).attr('checked')) {
        $(".change_me").attr('checked', 'checked');
    }
    // uncheck all
    else {
        $(".change_me").removeAttr('checked');    
    }
});