jqueryでチェックボックスを扱うときメモ
※jquery1.6付近でいろいろありましたが、jquery1.6.1以降で。
チェックする
$('.myCheckbox').prop('checked', true)
チェックをはずす
$('.myCheckbox').prop('checked', false)
チェックされているか確認する
//true/falseが返ってくる
if (this.checked) { /* チェックされているときの処理 */ }
もしくは
//true/falseが返ってくる
$('#myCheckbox').prop('checked');
もしくは
//true/falseが返ってくる
$('#myCheckbox').is(':checked');
活用例
tableで一覧表示しているときに、見出し行に置いたチェックボックスで、一覧の各行のチェックボックスを一括でON/OFFする例。

Javascript
//見出し行のチェックボックスに class="js-checkAllInTable" などのクラス名を付けておくとする
$(function() {
//一覧での全チェック
$('.js-checkAllInTable').on('click', function(){
$(this).parents('table:eq(0)').find('input[type="checkbox"]').prop('checked', this.checked);
});
});
DEMO
| No. | |
|---|---|
| 1 | |
| 2 | |
| 3 | |
| 4 | |
| 5 |