Почему attr() не обновляет HTML при вызове во второй раз?

Question

У меня есть сценарий, который должен выбрать флажок для ввода всех потомков, когда установлен флажок предка.

Смотрите здесь: http://jsfiddle.net/zJPfR/

Когда флажок верхнего уровня, все галочки под выбраны. Если вы отмените выбор флажка, проверки будут удалены. Однако, если вы попытаетесь сделать это во второй раз, это не сработает.

Если я ошибаюсь, сообщите мне.

Дарий

 $('.poSelect').click(function() { 
     var expandBox = $(this).parents('.pohelpTbl').next('.expandBox'); 
     var receipts = expandBox.find('input[type="checkbox"]'); 

     if ($(this).is(':checked')) { 
      var status = true; 
     } else { 
      var status = false; 
     } 

     $(receipts).each(function (i) { 
      var cb = $(this); 
      cb.attr("checked",status);   
     }); 
    }); 

Answer 1

Это должно быть

$('.poSelect').click(function() { 
    var receipts = $(this).closest('.pohelpTbl').next('.expandBox').find(':checkbox'); 

    receipts.prop('checked', this.checked); 
}); 

Там нет необходимости перебирать каждый из receipts элементов, вы можете позвоните по телефону .prop() прямо на номер receipts.

Демо: Fiddle

Answer 2

JQuery-х .attr использует только начальные атрибуты. Используйте .prop вместо .attr, чтобы изменить текущий DOM.
cb.attr("checked",status); =>cb.prop("checked",status);

Answer 3

наличие проверяемого атрибута является то, что показывает этот флажок, чтобы проверить, нет, если значение атрибута создается истина или ложь.

изменение от этого:

var cb = $(this); 
cb.attr("checked",status); 

к этому:

var cb = $(this); 
if (status){ 
    cb.attr("checked","checked"); 
} 
else{ 
    cb.removeAttr("checked"); 
}