2つのセレクトボックスがあり、どちらも選択していれば「検索」ボタンを押せるが
どちらか1つでも選択していなければ「検索」ボタンを押せない状態にしたいのですが
どのようにすれば可能でしょうか?
<script type="text/javascript">
jQuery(function() {
jQuery('#change_btn').click(function() {
jQuery.post('price.php',
{
size : jQuery('#size').attr('value'),
days : jQuery('#days').attr('value')
},
callBack);
});
});
function callBack(data) {
jQuery('#change_area').html(data);
}
</script>
<form action="" id="form1" method="post">
<select name="size" id="size">
<option value="">---選択してください---</option>
<option value="s1">サイズ01</option>
<option value="s2">サイズ02</option>
<option value="s3">サイズ03</option>
</select>
<select name="days" id="days">
<option value="">---選択してください---</option>
<option value="d6">6日</option>
<option value="d8">8日</option>
</select>
<input type="button" id="change_btn" value="検索" />
</form>
No.1
- 回答日時:
対象のボタンをdisabled(あるいは非表示)などにしておいて、セレクトボックスのonchangeイベントでセレクトボックスの値を両方チェックし、OKならボタンのdisabled設定を解除(または表示)のような処理をしてあげればよろしいかと思います。
No.2ベストアンサー
- 回答日時:
<form action="#" id="form1" method="post">
<select name="size" id="size" onchange="hohe()">
<option value="">---選択してください---</option>
<option value="s1">サイズ01</option>
<option value="s2">サイズ02</option>
<option value="s3">サイズ03</option>
</select>
<select name="days" id="days" onchange="hohe()">
<option value="">---選択してください---</option>
<option value="d6">6日</option>
<option value="d8">8日</option>
</select>
<input type="button" id="change_btn" value="検索" disabled>
</form>
--
function hohe () {
var d = document;
var e0 = d.getElementById ('size');
var e1 = d.getElementById ('days');
var e2 = d.getElementById ('change_btn');
e2.disabled = !(e0.value && e1.value);
}
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
- JavaScript セレクトボックスを2つ選択してメッセージなどを表示するには。~運賃検索プログラムを完成させたい~ 1 2022/07/22 11:10
- JavaScript セレクトボックスで配列を呼び出したい。 1 2022/07/08 20:14
- JavaScript console.logがどうしても2つ機能しないのでアドバイスをくださいお願いします 2 2022/07/07 22:13
- JavaScript sessionStorageを調べています。 1 2023/06/20 12:41
- JavaScript JavascriptからSQLへ繋ぎ方が分からない 3 2022/07/07 00:27
- JavaScript セレクトボックスを2つ設けて選択して初めてメッセを表示 1 2022/07/27 12:15
- JavaScript セレクトを全て選択されていないと、文字によるエラーメッセージを表示させるコードを調べています 2 2023/06/22 15:48
- JavaScript switch文のswitch(n)の部分を複数の値にするか、if文に変えてほしいです。 1 2022/07/27 17:18
- JavaScript 中百舌鳥駅と深井駅を入れ替えて選択しても同じ挙動にしたいです。 2 2022/06/24 18:45
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
今日の日付を自動的にセレクト...
-
プルダウンの選択値により活性...
-
selectを変更不可にしたい
-
セレクトボックスで配列を呼び...
-
Selectボックスの一覧表示方法
-
javascriptでセレクトボックス...
-
VBScriptでHTMLのセレクトボッ...
-
同じ名前のセレクトがある場合...
-
複数のプルダウンを1つにまとめ...
-
プルダウンで選択した項目にあ...
-
プルダウン選択を変更すると、...
-
JSONデータをフォームにセット...
-
jqueryでセレクトメニュー+スク...
-
ラジオボタンの選択に応じてプ...
-
全てのselect要素をデフォルト...
-
selectの初期値を設定したい
-
プルダウンの値によって活性・...
-
selectのnameが配列の場合
-
ラジオボタンとプルダウンを連...
-
動的にtextareaとselectを追加...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
全てのselect要素をデフォルト...
-
javascriptでセレクトボックス...
-
Selectボックスの一覧表示方法
-
JavaScriptで<select>の<option...
-
プルダウン選択を変更すると、...
-
select要素のvalueを配列で取得...
-
selectを変更不可にしたい
-
<input>の選択肢をプルダウンメ...
-
ラジオボタンとプルダウンを連...
-
【JS】selectでchangeした時の...
-
VBScriptでHTMLのセレクトボッ...
-
リストボックス内の重複したも...
-
同じ名前のセレクトがある場合...
-
プルダウンの値によって活性・...
-
selectが変更されたらnameを指...
-
【javascript】連想配列からセ...
-
3つのselectでURLパラメータを...
-
複数のプルダウンを1つにまとめ...
-
selectボックスで選択数を制限...
-
セレクトボックスで配列を呼び...
おすすめ情報