填坑系列: jQuery解决复选框只能全选一次

填坑系列: jQuery解决复选框只能全选一次

一开始的做法是这样的

$("[name='selectAll']:checkbox").click(function(){
if ($(this).attr("checked") == true) {
        $("[name='data-item']:checkbox").attr('checked', true);
    } else {
        $("[name='data-item']:checkbox").attr('checked', false);
    }
});

但是发现这样写只能全选和取消全选各一次, 之后点击selectAll复选框, 只有它自己被选中, 其他都未被选中

最终解决方法

$("[name='selectAll']:checkbox").click(function(){
if ($(this).prop("checked") == true) {
        $("[name='data-item']:checkbox").prop('checked', true);
    } else {
        $("[name='data-item']:checkbox").prop('checked', false);
    }
});

或者更简洁的方法

$("[name='selectAll']:checkbox").click(function(){
var checkOrNot = $(this).prop("checked");
    $("input[name='data-item']").prop("checked", checkOrNot);
});