Question

我在侧边栏中为该表的每一列创建了一个表格和一个复选框，以显示或隐藏该列，还有一个全选复选框。

问题是所有复选框都正常工作，但是选择所有复选框只能直观地工作，它会检查所有复选框，但它不会显示或隐藏所有列。

这是复选框代码：

$(document).ready(function() {
    $("input:checkbox:not(:checked)").each(function() {
        var column = "table ." + $(this).attr("name");
        $(column).hide();
    });

    $("input:checkbox").click(function() {
        var column = "table ." + $(this).attr("name");
        $(column).toggle();
    });
});

并选择所有复选框代码：

$('#select-all').on('change', function (e) {
    var $inputs = $('#checkboxlist input[type=checkbox]');
    if (e.originalEvent === undefined) {
        var allChecked = true;
        $inputs.each(function () {
            allChecked = allChecked && this.checked;
        });
        this.checked = allChecked;
    } else {
        $inputs.prop('checked', this.checked);
    }
});

Answer 1

第一名：最多Difference between change and click event of checkbox您需要通过更改活动替换您的点击事件

$("input:checkbox").change(function() {
    var column = "table ." + $(this).attr("name");
    $(column).toggle();
});

第二名：最多trigger the change event您需要使用.change()或.trigger('change')。

$inputs.prop('checked', this.checked).change();

Answer 2

$("input:checkbox").on('change',function() {

这应该可以正常工作......

全选复选框仅在视觉上有效

2 个答案: