1

私は次のフォームを持っています：

<select name="Country" id="select2-basic" tabindex="1" class="span7">
<option value="All Countries">All Countries</option>
<option value="Afghanistan">Afghanistan</option>
<option value="Aland Islands">Aland Islands</option>
<option value="Albania">Albania</option>
<option value="Algeria">Algeria</option>
<option value="American Samoa">American Samoa</option>
<option value="Andorra">Andorra</option>
<option value="Benin">Benin</option>
<option value="Bermuda">Bermuda</option>
<option value="Bhutan">Bhutan</option>
<option value="Turkmenistan">Turkmenistan</option>
<option value="UK">United Kingdom</option>
<option value="Turks and Caicos Islands">Turks and Caicos Islands</option>
<option value="Tuvalu">Tuvalu</option>
<option value="Uganda">Uganda</option>
<option value="Ukraine">Ukraine</option>
<option value="United Arab Emirates">United Arab Emirates</option>
<option value="United Kingdom">United Kingdom</option>
<option value="United States">United States</option>
<option value="United States Minor Outlying Islands">United States Minor Outlying Islands</option>
</select>


<select name="Quantity" id="select3-basic" tabindex="1" class="span1">
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
</select>


<input class="span1" readonly type="text" name="Visitors" value="">


<input class="span1" readonly type="text" name="Price" value="">

今、私はjqueryの専門家ではないので、これを機能させるには助けが必要です. 各国の価格は次のとおりです。

米国: $15 英国: $30 その他の国: $15

私がやりたいことは次のとおりです。

  1. ユーザーが [数量] 選択ボックスから値を選択すると、その数値に [訪問者] 入力フィールド内に 1000 を掛けた値が表示されます。
  2. ユーザーが国として米国を選択し、数量 = 5 の場合、[価格] フィールド内に $75 の値を表示するか、ユーザーが英国を選択して $150 を表示する場合

新しい国でも新しい価格を使用する予定なので、後で JS または JQuery 内で簡単に変更/追加できるものが必要です。

どうもありがとう！

4

3 に答える 3

2

.change()イベントを使用すると非常に簡単です。valueまた、属性を使用して国ごとに番号を割り当てる必要があります(例: 米国の値は 15 になります)。

//Quantity
$("#select3-basic").change(function() {
    var value = parseInt(this.value);
    value = value * 1000;

    $('input[name="Visitors"]').val(value);
});

//Country (change values to be the number to multiply!
$("#select2-basic").change(function() {
    var countryVal = parseInt($(this).data("quantity"));
        quantityVal = parseInt($("#select3-basic").val()),
        value = countryVal * quantityVal;

    $("input[name=Price]").val(value);
});
于 2013-09-19T15:06:53.340 に答える