1個でもチェックされたら表示したい
チェックボックスがチェックされたときに、何かを表示したい。
ではなく、どれか一個だけでもチェックされたら表示をしたい。
例えば共通の内容があって、片方がチェックされたら表示させたい。
サンプルコード
<input type="checkbox" class="check_item" onchange="anyOneCheckedShow('.check_item', '.show_item')"> <input type="checkbox" class="check_item" onchange="anyOneCheckedShow('.check_item', '.show_item')"> <div class="hidden show_item">見せたい要素</div>
function anyOneCheckedShow(check_target_selector, show_target_selector) { // チェックされている要素を配列に入れる var checkedList = []; $(check_target_selector).each((index, element) => { checkedList.push(element.checked); }); // 1つでもチェックされていれば表示 if (checkedList.indexOf(true) >= 0) { $(show_target_selector).show(); } else { $(show_target_selector).hide(); } }
- チェックがされたら関数を動かす
- チェック対象と、表示対象のセレクタを引数に渡す
- チェックされている要素を探す
- チェックが一つでもされていたら表示
この流れ。
引数がセレクタなので、関数を動かすタイミングを任意に変える事もできます。
もっといいコードとかアドバイスありましたら、是非お願いいたしますφ(・・