jquery设置所有复选框已选中

时间:2014-07-16 06:50:20

标签: javascript jquery checkbox

我正在使用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时,所有复选框都设置为选中。当我再次单击它时,将取消选中所有复选框。

当我再次点击它时,仍会出现警告框,但不会选中任何复选框。为什么它只在第一次工作?我该如何解决?

谢谢。

3 个答案:

答案 0 :(得分:25)

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

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

您的代码可以简化为

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

好读.prop() vs .attr()

答案 1 :(得分:6)

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

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

并且您不需要iterate更改所有元素以更改其属性。

答案 2 :(得分:1)

$("#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);
        });
    } 
});