jQuery 设置所有复选框为选中

Question

我正在使用jquery 1.11.1，这是我的代码：

$("#rowchkall").change(function(){
    if($(this).is(':checked')){
        $("input:checkbox[class=rowchk]").each(function() {
            alert("set checked");
            $(this).attr('checked', "checked");
        });
    }else{
        $("input:checkbox[class=rowchk]").each(function() {
            $(this).attr('checked', false);
        });
    } 
});

当我第一次点击#rowchkall时，所有的复选框都被设置为选中状态。当我再次点击时，所有的复选框都将变为未选中状态。

当我再次点击时，弹出框仍然会出现，但是没有任何一个复选框被选中。为什么它只在第一次起作用？我该如何修复它？

谢谢。

- user1995781

Answer 1

使用 .prop() 代替 .attr()

$(this).prop('checked', true); //true to check else false uncheck

你的代码可以简化为

$("#rowchkall").change(function () {
    $("input:checkbox.rowchk").prop('checked',this.checked);
});

好的阅读材料 .prop()和.attr()的区别

- Satpal

Answer 2

尝试使用 .prop() 替代 .attr()。

$("#rowchkall").change(function(){
  $("input:checkbox[class=rowchk]").prop('checked', this.checked);
});

您不需要遍历所有元素来更改其属性。

- Rajaprabhu Aravindasamy

Answer 3

$("#rowchkall").change(function(){
    if($(this).is(':checked')){
        $("input.rowchk[type=checkbox]").each(function() {
            alert("set checked");
            $(this).attr('checked',true);
        });
    }else{
        $("input.rowchk[type=checkbox]").each(function() {
            $(this).attr('checked', false);
        });
    } 
});

- budamivardi