jQuery不会正确地计算父元素中的元素

Question

我正在创建一个手风琴菜单，当所有复选框被选中时显示下一个项目。

它在第一步工作，但是一旦它通过手风琴菜单中的第一项，它不会正确计数复选框的数量。

这就是我到目前为止http://jsfiddle.net/EDYqs/ ...我已经离开警报，所以你可以看到它发现的复选框的数量。

这真的很难解释，所以你必须亲自看看问题所在。

Answer 1

只是将parent("dd")替换为parent（）。

 available = $(this).parent().children('input[type=checkbox]').length; 
     checked = $(this).parent().children('input[type=checkbox]:checked').length; 

Answer 2

您需要使用.closest()，而不是.parent()，因为<dd>不是复选框（什么this设置为点击处理内部，）的直接父。

例如

$('input[type=checkbox]').on('change', function(){ 
     available = $(this).closest('dd').find('input[type=checkbox]').length; 
     checked = $(this).closest('dd').find('input[type=checkbox]:checked').length; 

     // ... 
}); 

而且，考虑使用<label> S为复选框的文字，用自己for属性设置为复选框的ID（你需要给每个复选框课程的唯一ID）。这样用户可以点击文本来切换复选框，也可以通过屏幕阅读器等辅助功能技术知道该复选框的描述。