チェックボックスセレクター
セレクター :checkbox は
チェックボックスを選択します。タグ
checkbox を参照してください。
$(':checkbox') と同等のものは
$('[type=checkbox]') です。
:checkbox は CSS 仕様に含まれていないため、
パフォーマンスを向上させるには、現代の
ブラウザーでは代わりに
[type='checkbox'] を使用することをお勧めします。
構文
チェックボックスを選択する方法は以下の通りです:
$(':checkbox');
他の疑似クラスセレクターと同様に
(':' で始まる)、':' の前に
タグ名または他のセレクターを置くことをお勧めします。
そうしないと、セレクター '*' が
適用されます。
つまり、$(':checkbox') は
$('*:checkbox') として解釈されるため、
代わりに $('input:checkbox') を
使用することをお勧めします。
例
すべてのチェックボックスを選択し、
それらを span でラップしましょう。
次に、メソッド
css を使用して
span に緑色の背景と赤色の境界線を設定します:
<form>
<input type="button" value="button">
<input type="file">
<input type="checkbox">
<button>button</button>
<input type="reset">
<input type="radio" name="test">
<input type="radio" name="test">
<input type="checkbox">
<input type="text">
</form>
$('form input:checkbox')
.wrap('<span></span>')
.parent()
.css({background: 'green', border: '2px red solid'});
$('form').submit(function(event) {
event.preventDefault(); // フォームの送信を防止します
});
