「タイプ」と「レベル」の 2 つのドロップダウンがあるフォームがあります。
Type
-----
Hotel
Restaurant
Casino
Level
-----
1
2
3
そして、ドロップダウンで選択されたオプションに基づいて価格を表示する送信ボタン。価格は、その場でいくつかの基本的な数学によって計算されます。
jqueryを使用してこれを行うにはどうすればよいですか?
onchange() などを使用していますか?
jQuery のchange () 関数を使用して、選択リストが変更されたかどうかを確認できます。
これを行う方法は次のとおりです。
HTML:
Type
<select name="type" id="type">
<option value="hotel" selected>Hotel</option>
<option value="restaurant">Restaurant</option>
<option value="casino">Casino</option>
</select>Level
<select name="level" id="level">
<option value="1" selected>1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<div id="result"></div>
jQuery:
var result = 1;
$("#type").change(function () {
var val = $(this).val();
$("#result").html("Type is " + val + ", level is " + $("#level").val());
});
$("#level").change(function () {
var val = $(this).val();
// Some basic math
result = parseInt(val) * 5;
$("#result").html("Type is " + $("#type").val() + ", level is " + val + ", result: " + result);
});
関連する jsfiddle: http://jsfiddle.net/y2s4v/1/