不特定多数存在するselectタグの選択状況に応じて、動的に処理を加えたいです。
具体的には以下の構成の.selectがすべて未選択状態の時、別要素「#Btn1,#Btn2」に「.disabled」を付与し、どれか一つでも選択している場合は、「.disabled」を削除し代わりに「.abled」を付与したいです。
html
1 <div class="hoge1"> 2 <select class="select" name="mane"> 3 <option value="0">選択</option> 4 <option value="1">1</option> 5 <option value="2">2</option> 6 <option value="3">3</option> 7 </select> 8 </div> 9 <div class="hoge2"> 10 <select class="select" name="mane"> 11 <option value="0">選択</option> 12 <option value="1">1</option> 13 <option value="2">2</option> 14 <option value="3">3</option> 15 </select> 16 </div> 17 <div class="hoge3"> 18 <select class="select" name="mane"> 19 <option value="0">選択</option> 20 <option value="1">1</option> 21 <option value="2">2</option> 22 <option value="3">3</option> 23 </select> 24 </div> 25 <button id="Btn1" type="button">ボタン1</button> 26 <button id="Btn2" type="button">ボタン2</button>
以下の質問を参考に、
https://teratail.com/questions/61246
以下の内容を試してみたのですが上手くいきませんでした。
javascript
1 $(".select").change(function(){ 2 var cnt1 = $(".select:selected").length; 3 if(cnt1 == 0) { 4 $("#Btn1,#Btn2").addClass('disabled'); 5 $("#Btn1,#Btn2").removeClass('abled'); 6 } else { 7 $("#Btn1,#Btn2").addClass('abled'); 8 $("#Btn1,#Btn2").removeClass('disabled'); 9 } 10 });
ご教授のほどよろしくお願いいたします。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/05/02 07:03 編集