###前提・実現したいこと
チェックボックスとラジオボタンのcheckedを判定をして、クラスを付与、checkedがなければクラスを除去したい。
###発生している問題・エラーメッセージ
二者択一のラジオボタンでは、radio1を選択した後、radio2を選択すると、radio1に付与されたselectedクラスが取り除かれない。
コンソールログを見るとチェックボックスではtrue/falseが取得できているが、ラジオボタンではうまくtrue/falseを取得できていない。
###該当のソースコード
JSFiddle
html
1<input type="checkbox" id="cl" data-target="#icon01"> 2<label for="c1">check</label> 3<input name="radioCancelable" type="radio" id="r1" data-target="#icon02"> 4<label for="r1">radio1</label> 5<input name="radioCancelable" type="radio" id="r2" data-target="#icon03"> 6<label for="r2">radio2</label> 7 8<a id="icon01" href="#hoge">check1</a> 9<a id="icon02" href="#hoge">radio1</a> 10<a id="icon03" href="#hoge">radio2</a>
Javascript
1 var $check = $('input[type="checkbox"][data-target^="#icon"], input[type="radio"][data-target^="#icon"]') 2 $check.on("click", function () { 3 var $flag = ($(this).prop('checked')) ? 'addClass' : 'removeClass'; 4 console.log($(this).prop('checked')) 5 $($(this).attr('data-target'))[$flag]('selected'); 6 });
###試したこと
こちらもうまくいきませんでした…。
Javascript
1 var $check = $('input[type="checkbox"][data-target^="#icon"], input[type="radio"][data-target^="#icon"]') 2 $check.on("click", function () { 3 var $flag = ($(this).prop('checked')) ? 'addClass' : 'removeClass'; 4 $($(this).attr('data-target')).toggleClass('selected', $flag); 5 });
よろしくお願いいたします。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/10/05 07:12