【Vanilla JS】グループ毎にチェックボックスを全選択・全解除する

[ ID : 10597 ]
シルバー
【Vanilla JS】グループ毎にチェックボックスを全選択・全解除する
実装目安
1分

概要

チェックボックス「ALL(全て)」を配置して、グループ毎にチェックボックスを全選択・全解除する処理をJavaScriptで実装する。

用途・要件

  • 「ALL」を選択した際の処理
    • 「ALL」にチェックを入れた場合: 全てのチェックボックスにチェックする。
    • 「ALL」のチェックを外した場合: 全てのチェックボックスのチェックを外す。
  • 「ALL」以外を選択した際の処理
    • 「ALL」以外のチェックボックスが一つ以上チェックされている場合:「ALL」のチェックを外す。
    • 「ALL」以外のチェックボックスが全てチェックされている場合:「ALL」にチェックを入れる。
  • 同一ページへの複数設置可能。

検証ブラウザ

  • Google Chrome(最新)
  • Safari(最新)
  • Firefox(最新)
  • Microsoft Edge(最新)

実装

このコンテンツの続きを閲覧するにはログインが必要です。 新規会員登録

この記事をシェアする

関連記事

全ての記事を見る

KONOCODEのメリット 無料会員登録