“ピン”選択したラジオボタンのクラス?
-
05-07-2019 - |
質問
選択したラジオ入力にクラスを追加しようとしています 同じタイプの別のラジオが選択されたときにそのクラスを削除します
ラジオボタンにはクラス 'radio_button'がありますが、取得できません 以下のコードで変更するクラス。
jQuery(".radio_button").livequery('click',function() {
$('input.radio_button :radio').focus(updateSelectedStyle);
$('input.radio_button :radio').blur(updateSelectedStyle);
$('input.radio_button :radio').change(updateSelectedStyle);
}
function updateSelectedStyle() {
$('input.radio_button :radio').removeClass('focused');
$('input.radio_button :radio:checked').addClass('focused');
}
解決
Treの問題は、セレクターに余分なスペースが1つあるために発生します。
代わりに:
$('input.radio_button :radio')
書きたい:
$('input.radio_button:radio')
他のヒント
また、jQueryのチェーン可能性を利用して、実行する作業量を削減することもできます。 (これらのボタンを何度も再検索するのではなく。)このようなもの:
jQuery(".radio_button").livequery('click',function() {
$('input.radio_button:radio')
.focus(updateSelectedStyle)
.blur(updateSelectedStyle)
.change(updateSelectedStyle);
});
function updateSelectedStyle() {
$('input.radio_button:radio')
.removeClass('focused')
.filter(':checked').addClass('focused');
}
- 各ラジオボタンに一意のIDを与える
- クリックでIDを渡す
- " focuseded"を削除します同じクラスを持つすべてのラジオボタンのクラス名
- 「フォーカス」を追加します;渡したIDを持つラジオボタンのクラス
まず、余分なスペースに関するRene Saarsooの回答に同意します。
次に、スタイルをラジオボタンラベルに適用しようとしていますか?おそらく、何らかの方法でボタンとラベルをまとめたいと思うでしょう。例:
<span class="radiowrapper"><input type="radio" name="system" value="1" class="radio_button"> 1</span>
<br>
<span class="radiowrapper"><input type="radio" name="system" value="2" class="radio_button"> 2</span>
次に、livequery呼び出しの余分な呼び出しを取り除き、 updateSelectedStyle()関数からlivequery呼び出しにコードを移動します(そうでない場合はIEの問題に気付きました):
jQuery(".radio_button").livequery('click',function() {
$('input.radio_button:radio').parent(".radiowrapper").removeClass('focused');
$('input.radio_button:radio:checked').parent(".radiowrapper").addClass('focused');
});
所属していません StackOverflow