###前提・実現したいこと
現在3つの異なるセレクトボックスのoptionが空(value="")でなければ送信ボタンが押下できるような挙動をするプログラムを組みたいのですが、うまくできませんでした。
###発生している問題・エラーメッセージ
自分が書いたコードですと「#SB1」と「#SB2」のオプションを「---」としても、「#SB3」のセレクトボックスの値が入っていると送信できてしまいます。
また、「#SB1」のセレクトボックスの選択された値が空でなければ、「#SB2」が入力でき、「#SB2」のセレクトボックスの選択された値が空でなければ、「#SB3」が入力できるようにしたいです。
###該当のソースコード
HTML
1 <form action="" metohd="post"> 2 <select id="SB1" name="example1"> 3 <option value="">---</option> 4 <option value="サンプル1">サンプル1</option> 5 <option value="サンプル2">サンプル2</option> 6 <option value="サンプル3">サンプル3</option> 7 </select> 8 <select id="SB2" name="example2"> 9 <option value="">---</option> 10 <option value="サンプル4">サンプル4</option> 11 <option value="サンプル5">サンプル5</option> 12 <option value="サンプル6">サンプル6</option> 13 </select> 14 <select id="SB3" name="example3"> 15 <option value="">---</option> 16 <option value="サンプル7">サンプル7</option> 17 <option value="サンプル8">サンプル8</option> 18 <option value="サンプル9">サンプル9</option> 19 </select> 20 <input type="submit" value="送信"> 21 </form>
###該当のソースコード
js
1 <script> 2 $(function(){ 3 //デフォルトでdisable 4 $('#SB2, #SB3, input[type="submit"]').prop('disabled', true); 5 6 //条件によりdisabledを解除 7 $('#SB1').change(function() { 8 if($(this).val != ""){ 9 $('#SB2').prop('disabled', false); 10 } 11 }); 12 $('#SB2').change(function() { 13 if($(this).val != ""){ 14 $('#SB3').prop('disabled', false); 15 } 16 }); 17 18 $('#SB1,#SB2,#SB3').change(function () { 19 if($('#SB1' && '#SB2' && '#SB3').val() != ""){ 20 $('input[type="submit"]').prop('disabled', false); 21 } 22 if($('#SB1' && '#SB2' && '#SB3').val() == ""){ 23 $('input[type="submit"]').prop('disabled', true); 24 } 25 }); 26 }); 27 </script>
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/07/17 07:14
2017/07/17 09:15
2019/04/15 02:30
2019/04/15 02:30
2019/04/15 02:30