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

あなたは<dd>は（クリックハンドラ内に設定されているものをthis）チェックボックスの直接の親ではないとして、むしろ.parent()より、.closest()を使用する必要があります。

$('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; 

     // ... 
}); 

また、チェックボックスのIDに設定し、そのfor属性（あなたがチェックボックスのコースのユニークIDのそれぞれを与える必要があります）で、チェックボックスのテキストに<label> Sを使用することを検討してください。これにより、ユーザはテキストをクリックしてチェックボックスを切り替えることができ、スクリーンリーダーのようなアクセシビリティ技術もそのチェックボックスの説明を知ることができます。