jQueryで特定のIDで囲まれたcheckboxを一括ON/OFFする

webシステム構築している時に、【すべての項目をチェック】や【すべての項目を選択解除】などの処理がjQueryだと１行で実現できます。

jQueryを使って、一括で特定のIDで囲まれたチェックボックスをON/OFFする方法です。

■HTMLはこんな感じ

以下の様なHTMLを書きます。サンプルで３つのチェックボックスを用意しています。

<div id="testhogehoge">
    <input type="checkbox" name="test1" value="1">
    <input type="checkbox" name="test2" value="1">
    <input type="checkbox" name="test3" value="1">
</div>

■スクリプトの用意

jQueryを利用すると、ON/OFFのスクリプトが1行で実現することができます。

// すべてチェックを入れる
$('#testhogehoge input[type=checkbox]').prop('checked', true);

// すべてチェックを外す
$('#testhogehoge input[type=checkbox]').prop('checked', false);

とても簡単に実装できることができます。参考にしてみてください。