jquery实现checkbox 全选/全不选的通用写法

在jQuery中，实现checkbox的全选/全不选功能，可以通过监听一个主checkbox（通常用于表示全选）的状态变化，然后相应地更新其他checkbox的状态。以下是一个简洁且通用的实现方式：

$(document).ready(function() {
    // 假设有一个id为'checkAll'的checkbox用于全选
    $('#checkAll').change(function() {
        // 使用prop方法设置所有checkbox（除了全选checkbox）的checked属性
        // 假设其他checkbox都有一个共同的class，比如'itemCheckbox'
        $('.itemCheckbox').prop('checked', $(this).is(':checked'));
    });

    // 可选：如果你还希望当所有子checkbox都被选中时，自动选中全选checkbox
    $('.itemCheckbox').change(function() {
        // 检查是否所有子checkbox都被选中
        if ($('.itemCheckbox:checked').length == $('.itemCheckbox').length) {
            $('#checkAll').prop('checked', true);
        } else {
            $('#checkAll').prop('checked', false);
        }
    });
});

这段代码首先监听了一个id为`checkAll`的checkbox的`change`事件。当这个checkbox的状态改变时，它会使用jQuery的`.prop()`方法更新所有具有`itemCheckbox`类的checkbox的`checked`属性，以匹配`checkAll`checkbox的状态。

然后，代码还添加了一个可选的监听器，用于监听所有具有`itemCheckbox`类的checkbox的`change`事件。这个监听器会检查是否所有的子checkbox都被选中了，如果是，则自动选中`checkAll`checkbox；如果有任何一个子checkbox未被选中，则取消选中`checkAll`checkbox。

请注意，你需要根据你的具体HTML结构来修改选择器（如`#checkAll`和`.itemCheckbox`），以确保它们正确地指向你的全选checkbox和子checkbox。