jquery đặt tất cả các hộp kiểm kiểm tra

Question

Tôi đang sử dụng jquery 1.11.1 và đây là mã của tôi:

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

Khi tôi lần đầu tiên bấm vào #rowchkall, tất cả các hộp kiểm được thiết lập để kiểm tra. Khi tôi nhấp lại vào nó, tất cả hộp kiểm sẽ được bỏ chọn.

Khi tôi nhấp lại vào nó, hộp cảnh báo vẫn xuất hiện nhưng không có hộp kiểm nào được chọn. Tại sao nó chỉ hoạt động lần đầu tiên? Làm thế nào tôi có thể sửa chữa nó?

Cảm ơn bạn.

Answer 1

Sử dụng .prop() thay vì .attr()

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

Mã của bạn có thể được đơn giản hóa như

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

A Good đọc .prop() vs .attr()

Answer 2

Cố gắng sử dụng .prop() thay vì .attr()

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

Và bạn không cần phải iterate trên tất cả các yếu tố để thay đổi thuộc tính của nó.

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); 
     }); 
    } 
});