前提
【チェックボックス複数設置について】
htmlでサイトを作成しております。ページ内の申し込みフォームのテーブルにチェックボックスを複数設置して
各項目毎に「全て選択」ができるようにしたいのですが、
現状は全ての項目のチェックボックスが全て選択されてしまいます。
実現したいこと
各項目毎にそれぞれのチェックボックス全て選択させるにはどうすればいいでしょうか?初歩的な質問ですいません。
よろしくお願いします。(以下のような記述をコピペして複数配置しています)
発生している問題・エラーメッセージ
全項目がチェックされてしまいます
該当のソースコード
受講学期 第一期:基礎編(受講をご希望される時限にチェックする) 全て選択する 0時限 1時限 2時限 //「全て選択」のチェックボックス let checkAll = document.getElementById("checkAll"); //「全て選択」以外のチェックボックス let el = document.getElementsByClassName("checks"); //全てのチェックボックスをON/OFFする const funcCheckAll = (bool) => { for (let i = 0; i < el.length; i++) { el[i].checked = bool; } } //「checks」のclassを持つ要素のチェック状態で「全て選択」のチェック状態をON/OFFする const funcCheck = () => { let count = 0; for (let i = 0; i < el.length; i++) { if (el[i].checked) { count += 1; } } if (el.length === count) { checkAll.checked = true; } else { checkAll.checked = false; } }; //「全て選択」のチェックボックスをクリックした時 checkAll.addEventListener("click",() => { funcCheckAll(checkAll.checked); },false); //「全て選択」以外のチェックボックスをクリックした時 for (let i = 0; i < el.length; i++) { el[i].addEventListener("click", funcCheck, false); }試したこと
ここに問題に対して試したことを記載してください。
補足情報(FW/ツールのバージョンなど)
ここにより詳細な情報を記載してください。
0 コメント