jquery .on基于所选值更改输入字段中的实时更新

Question

安全加密功能正常工作。 现在我想要的是，在keyup函数执行计算之后，如果我继续并更改select选项，则根据选定的选项执行计算，而无需再次键入，除非可能是我想更改金额。

在此先感谢。

讨好是fiddle

$('#buyselect').change(function() { 

var value = $(this).val(); 
switch (value) { 
    case 'btc': 
    var rate = 4.7; 
    var ngnrate = 5.7; 

    var buyusd = $("#buyusd"); 
    buyusd.keyup(function() { 
     var total = isNaN(parseInt(buyusd.val() * rate)) ? 0 : (buyusd.val() * rate); 
     total1 = parseFloat(total).toFixed(2); 
     $("#buyghc").val(total1); 

     var ngntotal = isNaN(parseInt(buyusd.val() * ngnrate)) ? 0 : (buyusd.val() * ngnrate); 
     ngntotal1 = parseFloat(ngntotal).toFixed(2); 
     $("#buyngn").val(ngntotal1); 
    }); 

    var buyghc = $("#buyghc"); 
    buyghc.keyup(function() { 
     var total = isNaN(parseInt(buyghc.val()/rate)) ? 0 : (buyghc.val()/rate); 
     total1 = parseFloat(total).toFixed(2); 
     $("#buyusd").val(total1); 

     var ngntotal = isNaN(parseInt(total1 * ngnrate)) ? 0 : (total1 * ngnrate); 
     ngntotal1 = parseFloat(ngntotal).toFixed(2); 
     $("#buyngn").val(ngntotal1); 

    }); 

    var buyngn = $("#buyngn"); 
    buyngn.keyup(function() { 
     var total = isNaN(parseInt(buyngn.val()/ngnrate)) ? 0 : (buyngn.val()/ngnrate); 
     total1 = parseFloat(total).toFixed(2); 
     $("#buyusd").val(total1); 

     var ghctotal = isNaN(parseInt(total1 * rate)) ? 0 : (total1 * rate); 
     ghctotal1 = parseFloat(ghctotal).toFixed(2); 
     $("#buyghc").val(ghctotal1); 
    }); 
    break; 

    case 'gcr': 
    var rate = 7; 
    var ngnrate = 3; 

    var buyusd = $("#buyusd"); 
    buyusd.keyup(function() { 
     var total = isNaN(parseInt(buyusd.val() * rate)) ? 0 : (buyusd.val() * rate); 
     total1 = parseFloat(total).toFixed(2); 
     $("#buyghc").val(total1); 

     var ngntotal = isNaN(parseInt(buyusd.val() * ngnrate)) ? 0 : (buyusd.val() * ngnrate); 
     ngntotal1 = parseFloat(ngntotal).toFixed(2); 
     $("#buyngn").val(ngntotal1); 
    }); 

    var buyghc = $("#buyghc"); 
    buyghc.keyup(function() { 
     var total = isNaN(parseInt(buyghc.val()/rate)) ? 0 : (buyghc.val()/rate); 
     total1 = parseFloat(total).toFixed(2); 
     $("#buyusd").val(total1); 

     var ngntotal = isNaN(parseInt(total1 * ngnrate)) ? 0 : (total1 * ngnrate); 
     ngntotal1 = parseFloat(ngntotal).toFixed(2); 
     $("#buyngn").val(ngntotal1); 

    }); 

    var buyngn = $("#buyngn"); 
    buyngn.keyup(function() { 
     var total = isNaN(parseInt(buyngn.val()/ngnrate)) ? 0 : (buyngn.val()/ngnrate); 
     total1 = parseFloat(total).toFixed(2); 
     $("#buyusd").val(total1); 

     var ghctotal = isNaN(parseInt(total1 * rate)) ? 0 : (total1 * rate); 
     ghctotal1 = parseFloat(ghctotal).toFixed(2); 
     $("#buyghc").val(ghctotal1); 
    }); 
    break; 
} }); 

Answer 1

你应该创建两个functions。

$('#buyselect').change(function() { 
 

 
     var value = $('#buyselect').val(); 
 
    switch (value) { 
 
     case 'btc': 
 
     var rate = 4.7; 
 
     var ngnrate = 5.7; 
 

 
     var buyusd = $("#buyusd"); 
 
      var total = isNaN(parseInt(buyusd.val() * rate)) ? 0 : (buyusd.val() * rate); 
 
      total1 = parseFloat(total).toFixed(2); 
 
      $("#buyghc").val(total1); 
 

 
      var ngntotal = isNaN(parseInt(buyusd.val() * ngnrate)) ? 0 : (buyusd.val() * ngnrate); 
 
      ngntotal1 = parseFloat(ngntotal).toFixed(2); 
 
      $("#buyngn").val(ngntotal1); 
 

 
     var buyghc = $("#buyghc"); 
 
      var total = isNaN(parseInt(buyghc.val()/rate)) ? 0 : (buyghc.val()/rate); 
 
      total1 = parseFloat(total).toFixed(2); 
 
      $("#buyusd").val(total1); 
 

 
      var ngntotal = isNaN(parseInt(total1 * ngnrate)) ? 0 : (total1 * ngnrate); 
 
      ngntotal1 = parseFloat(ngntotal).toFixed(2); 
 
      $("#buyngn").val(ngntotal1); 
 

 
     var buyngn = $("#buyngn"); 
 
      var total = isNaN(parseInt(buyngn.val()/ngnrate)) ? 0 : (buyngn.val()/ngnrate); 
 
      total1 = parseFloat(total).toFixed(2); 
 
      $("#buyusd").val(total1); 
 

 
      var ghctotal = isNaN(parseInt(total1 * rate)) ? 0 : (total1 * rate); 
 
      ghctotal1 = parseFloat(ghctotal).toFixed(2); 
 
      $("#buyghc").val(ghctotal1); 
 
     break; 
 

 
     case 'gcr': 
 
     var rate = 7; 
 
     var ngnrate = 3; 
 

 
     var buyusd = $("#buyusd"); 
 
      var total = isNaN(parseInt(buyusd.val() * rate)) ? 0 : (buyusd.val() * rate); 
 
      total1 = parseFloat(total).toFixed(2); 
 
      $("#buyghc").val(total1); 
 

 
      var ngntotal = isNaN(parseInt(buyusd.val() * ngnrate)) ? 0 : (buyusd.val() * ngnrate); 
 
      ngntotal1 = parseFloat(ngntotal).toFixed(2); 
 
      $("#buyngn").val(ngntotal1); 
 

 
     var buyghc = $("#buyghc"); 
 
      var total = isNaN(parseInt(buyghc.val()/rate)) ? 0 : (buyghc.val()/rate); 
 
      total1 = parseFloat(total).toFixed(2); 
 
      $("#buyusd").val(total1); 
 

 
      var ngntotal = isNaN(parseInt(total1 * ngnrate)) ? 0 : (total1 * ngnrate); 
 
      ngntotal1 = parseFloat(ngntotal).toFixed(2); 
 
      $("#buyngn").val(ngntotal1); 
 

 
     var buyngn = $("#buyngn"); 
 
      var total = isNaN(parseInt(buyngn.val()/ngnrate)) ? 0 : (buyngn.val()/ngnrate); 
 
      total1 = parseFloat(total).toFixed(2); 
 
      $("#buyusd").val(total1); 
 

 
      var ghctotal = isNaN(parseInt(total1 * rate)) ? 0 : (total1 * rate); 
 
      ghctotal1 = parseFloat(ghctotal).toFixed(2); 
 
      $("#buyghc").val(ghctotal1); 
 
     break; 
 
    } 
 
    }); 
 
    function change_value(){ 
 
    var value = $('#buyselect').val(); 
 
    switch (value) { 
 
     case 'btc': 
 
     var rate = 4.7; 
 
     var ngnrate = 5.7; 
 

 
     var buyusd = $("#buyusd"); 
 
     buyusd.keyup(function() { 
 
      var total = isNaN(parseInt(buyusd.val() * rate)) ? 0 : (buyusd.val() * rate); 
 
      total1 = parseFloat(total).toFixed(2); 
 
      $("#buyghc").val(total1); 
 

 
      var ngntotal = isNaN(parseInt(buyusd.val() * ngnrate)) ? 0 : (buyusd.val() * ngnrate); 
 
      ngntotal1 = parseFloat(ngntotal).toFixed(2); 
 
      $("#buyngn").val(ngntotal1); 
 
     }); 
 

 
     var buyghc = $("#buyghc"); 
 
     buyghc.keyup(function() { 
 
      var total = isNaN(parseInt(buyghc.val()/rate)) ? 0 : (buyghc.val()/rate); 
 
      total1 = parseFloat(total).toFixed(2); 
 
      $("#buyusd").val(total1); 
 

 
      var ngntotal = isNaN(parseInt(total1 * ngnrate)) ? 0 : (total1 * ngnrate); 
 
      ngntotal1 = parseFloat(ngntotal).toFixed(2); 
 
      $("#buyngn").val(ngntotal1); 
 

 
     }); 
 

 
     var buyngn = $("#buyngn"); 
 
     buyngn.keyup(function() { 
 
      var total = isNaN(parseInt(buyngn.val()/ngnrate)) ? 0 : (buyngn.val()/ngnrate); 
 
      total1 = parseFloat(total).toFixed(2); 
 
      $("#buyusd").val(total1); 
 

 
      var ghctotal = isNaN(parseInt(total1 * rate)) ? 0 : (total1 * rate); 
 
      ghctotal1 = parseFloat(ghctotal).toFixed(2); 
 
      $("#buyghc").val(ghctotal1); 
 
     }); 
 
     break; 
 

 
     case 'gcr': 
 
     var rate = 7; 
 
     var ngnrate = 3; 
 

 
     var buyusd = $("#buyusd"); 
 
     buyusd.keyup(function() { 
 
      var total = isNaN(parseInt(buyusd.val() * rate)) ? 0 : (buyusd.val() * rate); 
 
      total1 = parseFloat(total).toFixed(2); 
 
      $("#buyghc").val(total1); 
 

 
      var ngntotal = isNaN(parseInt(buyusd.val() * ngnrate)) ? 0 : (buyusd.val() * ngnrate); 
 
      ngntotal1 = parseFloat(ngntotal).toFixed(2); 
 
      $("#buyngn").val(ngntotal1); 
 
     }); 
 

 
     var buyghc = $("#buyghc"); 
 
     buyghc.keyup(function() { 
 
      var total = isNaN(parseInt(buyghc.val()/rate)) ? 0 : (buyghc.val()/rate); 
 
      total1 = parseFloat(total).toFixed(2); 
 
      $("#buyusd").val(total1); 
 

 
      var ngntotal = isNaN(parseInt(total1 * ngnrate)) ? 0 : (total1 * ngnrate); 
 
      ngntotal1 = parseFloat(ngntotal).toFixed(2); 
 
      $("#buyngn").val(ngntotal1); 
 

 
     }); 
 

 
     var buyngn = $("#buyngn"); 
 
     buyngn.keyup(function() { 
 
      var total = isNaN(parseInt(buyngn.val()/ngnrate)) ? 0 : (buyngn.val()/ngnrate); 
 
      total1 = parseFloat(total).toFixed(2); 
 
      $("#buyusd").val(total1); 
 

 
      var ghctotal = isNaN(parseInt(total1 * rate)) ? 0 : (total1 * rate); 
 
      ghctotal1 = parseFloat(ghctotal).toFixed(2); 
 
      $("#buyghc").val(ghctotal1); 
 
     }); 
 
     break; 
 
    } 
 
    }

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 

 
<select class="form-control" id="buyselect"> 
 
    <option> </option> 
 
    <option value="btc">BITCOIN</option> 
 
    <option value="gcr">GCR COIN</option> 
 
</select> 
 

 
<div> 
 
    <div class="form-group"> 
 
    <label for="amount">Amount in USD:</label> 
 
    <input type="number" class="form-control" id="buyusd" onkeypress="return change_value()"> 
 
    </div> 
 
</div> 
 

 
<div> 
 
    <div class="form-group"> 
 
    <label for="amount">Amount in GHC:</label> 
 
    <input type="number" class="form-control" id="buyghc"> 
 
    </div> 
 
</div> 
 

 
<div> 
 
    <div class="form-group"> 
 
    <label for="amount">Amount in NGN:</label> 
 
    <input type="number" class="form-control" id="buyngn"> 
 
    </div> 
 
</div>

Answer 2

创建一个共同的功能，并呼吁在该电平变化的功能和安其高达 codepen链接https://codepen.io/kalaiselvan/pen/KqMPaK

 $(function(){ 
    $("#buyusd").keyup(function(){ 
     calculate(); 
    }) 
    $('#buyselect').change(function() { 
     calculate(); 
    }) 
}); 
function calculate(){ 
    var value = $("#buyselect").val(); 
    switch (value) { 
      case 'btc': 
      var rate = 4.7; 
      var ngnrate = 5.7; 

      var buyusd = $("#buyusd"); 

       var total = isNaN(parseInt(buyusd.val() * rate)) ? 0 : (buyusd.val() * rate); 
       total1 = parseFloat(total).toFixed(2); 
       $("#buyghc").val(total1); 

       var ngntotal = isNaN(parseInt(buyusd.val() * ngnrate)) ? 0 : (buyusd.val() * ngnrate); 
       ngntotal1 = parseFloat(ngntotal).toFixed(2); 
       $("#buyngn").val(ngntotal1); 


       var total = isNaN(parseInt(buyghc.val()/rate)) ? 0 : (buyghc.val()/rate); 
       total1 = parseFloat(total).toFixed(2); 
       $("#buyusd").val(total1); 

       var ngntotal = isNaN(parseInt(total1 * ngnrate)) ? 0 : (total1 * ngnrate); 
       ngntotal1 = parseFloat(ngntotal).toFixed(2); 
       $("#buyngn").val(ngntotal1); 

       var total = isNaN(parseInt(buyngn.val()/ngnrate)) ? 0 : (buyngn.val()/ngnrate); 
       total1 = parseFloat(total).toFixed(2); 
       $("#buyusd").val(total1); 

       var ghctotal = isNaN(parseInt(total1 * rate)) ? 0 : (total1 * rate); 
       ghctotal1 = parseFloat(ghctotal).toFixed(2); 
       $("#buyghc").val(ghctotal1); 
      break; 

      case 'gcr': 
      var rate = 7; 
      var ngnrate = 3; 

      var buyusd = $("#buyusd"); 

       var total = isNaN(parseInt(buyusd.val() * rate)) ? 0 : (buyusd.val() * rate); 
       total1 = parseFloat(total).toFixed(2); 
       $("#buyghc").val(total1); 

       var ngntotal = isNaN(parseInt(buyusd.val() * ngnrate)) ? 0 : (buyusd.val() * ngnrate); 
       ngntotal1 = parseFloat(ngntotal).toFixed(2); 
       $("#buyngn").val(ngntotal1); 



       var total = isNaN(parseInt(buyghc.val()/rate)) ? 0 : (buyghc.val()/rate); 
       total1 = parseFloat(total).toFixed(2); 
       $("#buyusd").val(total1); 

       var ngntotal = isNaN(parseInt(total1 * ngnrate)) ? 0 : (total1 * ngnrate); 
       ngntotal1 = parseFloat(ngntotal).toFixed(2); 
       $("#buyngn").val(ngntotal1); 


       var total = isNaN(parseInt(buyngn.val()/ngnrate)) ? 0 : (buyngn.val()/ngnrate); 
       total1 = parseFloat(total).toFixed(2); 
       $("#buyusd").val(total1); 

       var ghctotal = isNaN(parseInt(total1 * rate)) ? 0 : (total1 * rate); 
       ghctotal1 = parseFloat(ghctotal).toFixed(2); 
       $("#buyghc").val(ghctotal1); 

      break; 
     } 

}