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）。這樣用戶可以點擊文本來切換複選框，也可以通過屏幕閱讀器等輔助功能技術知道該複選框的描述。