ラジオセレクター
セレクター :radio はラジオ
ボタンを選択します。タグ
radio
を参照してください。
$(':radio') と同等なのは
$('[type=radio]') です。
:radio はCSS仕様に含まれないため、
パフォーマンスを向上させるには、現代の
ブラウザでは代わりに [type='radio']
を使用する方が良いでしょう。
構文
ラジオボタンをこのように選択します：
$(':radio');
他の疑似クラスセレクターと同様に
（':' で始まる）、':' の前に
タグ名または他のセレクターを指定する方が良いです。
そうしないとセレクター '*'
が適用され、
つまり $(':radio') は
$('*:radio') と解釈されます。そのため、
代わりに $('input:radio') を
使用する方が良いです。
関連するラジオボタンを選択するには、
$('input[name=gender]:radio')
が使用できます。
例
ラジオボタンを選択し、spanで
ラップしてみましょう。次に、spanに
メソッド
css
を使用して緑の背景と赤い枠を
設定します：
<form>
<input type="button" value="button">
<input type="file">
<button>button</button>
<input type="reset">
<input type="radio" name="test">
<input type="radio" name="test">
<input type="text">
</form>
<+javascript+>
$('form input:radio')
.wrap('')
.parent()
.css({background: 'green', border: '2px red solid'});
$('form').submit(function(event) {
event.preventDefault(); // フォームの送信を防ぎます
});
<-javascript->
