Question

我对我创建的货币计算器有一个小问题。一切都按照我的意愿运作，但是当我在下拉列表中更改货币时，在我手动输入新金额之前，值不会改变。我如何调整代码，以便转换更新到正确的数量，而无需重新输入您想要的数字？

提前致谢。

<script>
$(document).ready(function() {
$("#from").msDropdown();
})
</script>

<script>
$(document).ready(function() {
   $("#to").msDropdown();
    })
</script>

<script>
$(document).change(function() {
  getSingleExchange();
});


function getSingleExchange() {
  var fromCurr = $("#to option:selected").val();
  var toCurr = $("#from option:selected").val();
  var from = $('input[name=target_value]').val();
  var to = $('input[name=base_value]').val();

 rate = parseInt(from) / parseInt(to);

  output = " Exchange Rate: " + toCurr + " to " + fromCurr + " = " + rate.toFixed(2) + ". Please input new figures if changing currency. ";

  $("#singleExchangeValue").html(output);
}
</script>

<form class="frConverter">
<div class="field-row">
            <div class="from">
                <label for="from">Sending From:</label>
                <select id="from" value="gbp" name="base_currency" class="select-box">
                      <option value="USD">United States (Dollar) - USD</option>
                      <option value="GBP">United Kingdom (Pound) - GBP</option>
                      <option value="EUR">Albania (Euro) - EUR</option>
                      <option value="EUR">Andorra (Euro) - EUR</option>
                      <option value="ARS">Argentina (Peso) - ARS</option>
                      <option value="AUD">Australia (Dollar) - AUD</option>
                      <option value="EUR">Austria (Euro) - EUR</option>
                      <option value="EUR">Belgium (Euro) - EUR</option>
                      <option value="BOB">Bolivia (Boliviano) - BOB</option>
                      <option value="BRL">Brazil (Real) - BRL</option>
                      <option value="EUR">Bulgaria (Euro) - EUR</option>
                      <option value="CAD">Canada (Dollar) - CAD</option>
                      <option value="CLP">Chile (Peso) - CLP</option>
                      <option value="CNY">China (Yuan Renminbi) - CNY</option>
                      <option value="COP">Colombia (Peso) - COP</option>
                      <option value="CRC">Costa Rice (Colon) - CRC</option>
                      <option value="EUR">Cyprus (Euro) - EUR</option>
                      <option value="DKK">Denmark (Krona) - DKK</option>
                      <option value="DOP">Dom. Rep. (Peso) - DOP</option>
                      <option value="USD">Dom. Rep. (Dollar) - USD</option>
                      <option value="USD">Ecuador (Dollar) - USD</option>
                      <option value="USD">El Salvador (Dollar) - USD</option>
                    </select>
                    <input type="text" name="base_value" size="10" value="500">
                    <input type="hidden" name="default_base" value="gbp">
                </div>

                <div class="to">
                    <label for="to">Sending To:</label>
                <select id="to" value="USD" name="target_currency" class="select-box">
                      <option value="USD">United States (Dollar) - USD</option>
                      <option value="GBP">United Kingdom (Pound) - GBP</option>
                      <option value="EUR">Albania (Euro) - EUR</option>
                      <option value="EUR">Andorra (Euro) - EUR</option>
                      <option value="ARS">Argentina (Peso) - ARS</option>
                      <option value="AUD">Australia (Dollar) - AUD</option>
                      <option value="EUR">Austria (Euro) - EUR</option>
                      <option value="EUR">Belgium (Euro) - EUR</option>
                      <option value="BOB">Bolivia (Boliviano) - BOB</option>
                      <option value="BRL">Brazil (Real) - BRL</option>
                      <option value="EUR">Bulgaria (Euro) - EUR</option>
                      <option value="CAD">Canada (Dollar) - CAD</option>
                      <option value="CLP">Chile (Peso) - CLP</option>
                      <option value="CNY">China (Yuan Renminbi) - CNY</option>
                      <option value="COP">Colombia (Peso) - COP</option>
                      <option value="CRC">Costa Rice (Colon) - CRC</option>
                      <option value="EUR">Cyprus (Euro) - EUR</option>
                      <option value="DKK">Denmark (Krona) - DKK</option>
                      <option value="DOP">Dom. Rep. (Peso) - DOP</option>
                      <option value="USD">Dom. Rep. (Dollar) - USD</option>
                      <option value="USD">Ecuador (Dollar) - USD</option>
                      <option value="USD">El Salvador (Dollar) - USD</option>
                    </select>
<input type="hidden" name="default_target" value="usd">
<input type="text" name="target_value" size="10" value="">
                </div>
            </div>
<div id="singleExchangeValue" style="color:white !important; font-size:12px"></div>
<br>
</form>

Answer 1

在所有四个表单元素上绑定change事件。转换在示例中不起作用，但这纯粹是出于事件处理的目的。

＆＃13;

$('#target_value,#base_value,#to,#from').change(function() {
  getSingleExchange();
});


function getSingleExchange() {
  var fromCurr = $("#from option:selected").val();
  var toCurr = $("#to option:selected").val();
  var from = $('input[name=target_value]').val();
  var to = $('input[name=base_value]').val();

 alert('Convert from ' + fromCurr + ' - ' + toCurr);

 rate = parseInt(from) / parseInt(to);

  output = " Exchange Rate: " + toCurr + " to " + fromCurr + " = " + rate.toFixed(2) + ". Please input new figures if changing currency. ";

  $("#singleExchangeValue").html(output);
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form class="frConverter">
<div class="field-row">
            <div class="from">
                <label for="from">Sending From:</label>
                <select id="from" value="gbp" name="base_currency" class="select-box">
                      <option value="USD">United States (Dollar) - USD</option>
                      <option value="GBP">United Kingdom (Pound) - GBP</option>
                      <option value="EUR">Albania (Euro) - EUR</option>
                      <option value="EUR">Andorra (Euro) - EUR</option>
                      <option value="ARS">Argentina (Peso) - ARS</option>
                      <option value="AUD">Australia (Dollar) - AUD</option>
                      <option value="EUR">Austria (Euro) - EUR</option>
                      <option value="EUR">Belgium (Euro) - EUR</option>
                      <option value="BOB">Bolivia (Boliviano) - BOB</option>
                      <option value="BRL">Brazil (Real) - BRL</option>
                      <option value="EUR">Bulgaria (Euro) - EUR</option>
                      <option value="CAD">Canada (Dollar) - CAD</option>
                      <option value="CLP">Chile (Peso) - CLP</option>
                      <option value="CNY">China (Yuan Renminbi) - CNY</option>
                      <option value="COP">Colombia (Peso) - COP</option>
                      <option value="CRC">Costa Rice (Colon) - CRC</option>
                      <option value="EUR">Cyprus (Euro) - EUR</option>
                      <option value="DKK">Denmark (Krona) - DKK</option>
                      <option value="DOP">Dom. Rep. (Peso) - DOP</option>
                      <option value="USD">Dom. Rep. (Dollar) - USD</option>
                      <option value="USD">Ecuador (Dollar) - USD</option>
                      <option value="USD">El Salvador (Dollar) - USD</option>
                    </select>
                    <input type="text" id="base_value" name="base_value" size="10" value="500">
                    <input type="hidden" name="default_base" value="gbp">
                </div>

                <div class="to">
                    <label for="to">Sending To:</label>
                <select id="to" value="USD" name="target_currency" class="select-box">
                      <option value="USD">United States (Dollar) - USD</option>
                      <option value="GBP">United Kingdom (Pound) - GBP</option>
                      <option value="EUR">Albania (Euro) - EUR</option>
                      <option value="EUR">Andorra (Euro) - EUR</option>
                      <option value="ARS">Argentina (Peso) - ARS</option>
                      <option value="AUD">Australia (Dollar) - AUD</option>
                      <option value="EUR">Austria (Euro) - EUR</option>
                      <option value="EUR">Belgium (Euro) - EUR</option>
                      <option value="BOB">Bolivia (Boliviano) - BOB</option>
                      <option value="BRL">Brazil (Real) - BRL</option>
                      <option value="EUR">Bulgaria (Euro) - EUR</option>
                      <option value="CAD">Canada (Dollar) - CAD</option>
                      <option value="CLP">Chile (Peso) - CLP</option>
                      <option value="CNY">China (Yuan Renminbi) - CNY</option>
                      <option value="COP">Colombia (Peso) - COP</option>
                      <option value="CRC">Costa Rice (Colon) - CRC</option>
                      <option value="EUR">Cyprus (Euro) - EUR</option>
                      <option value="DKK">Denmark (Krona) - DKK</option>
                      <option value="DOP">Dom. Rep. (Peso) - DOP</option>
                      <option value="USD">Dom. Rep. (Dollar) - USD</option>
                      <option value="USD">Ecuador (Dollar) - USD</option>
                      <option value="USD">El Salvador (Dollar) - USD</option>
                    </select>
<input type="hidden" name="default_target" value="usd">
<input type="text" id="target_value" name="target_value" size="10" value="">
                </div>
            </div>
<div id="singleExchangeValue" style="color:white !important; font-size:12px"></div>
<br>
</form>

＆＃13;

Javascript变量自动更改

1 个答案: