我試圖在選中父項時檢查所有子項複選框。但是這隻工作一次！當我下次嘗試時，孩子不會被檢查？

Question

$(document).ready(function (e) { 
    $('.links > input').change(function() { 
     if ($(this).is(':checked')) { 
      $(this).parent().children('.subLinks').children('.subLinkCheck').children().attr('checked', true); 
     } else 
      $(this).parent().children('.subLinks').children('.subLinkCheck').children().attr('checked', false);; 
    }); 
}); 

它第一次正常工作。當我取消孩子複選框，然後單擊父複選框，它失敗了，

這是HTML內容

<ul id="mainLink"> 
    <li class="links"> 
     <input type="checkbox" />Interactive Community 
     <ul class="subLinks"> 
      <li class="subLinkCheck"> 
       <input class="1" type="checkbox" />Usability Testing</li> 
      <li class="subLinkCheck"> 
       <input type="checkbox" />HFI Certification</li> 
     </ul> 
    </li> 
    <li class="links"> 
     <input type="checkbox" />Heuristic Evaluations 
     <ul class="subLinks"> 
      <li class="subLinkCheck"> 
       <input type="checkbox" />Usability Testing</li> 
      <li class="subLinkCheck"> 
       <input type="checkbox" />HFI Certification</li> 
     </ul> 
    </li> 
</ul> 

Answer 1

使用.prop()，而不是.attr()。

演示：http://jsfiddle.net/Jrrnj/