jQuery的填充inputfield计算器

Question

自动我有个一个字段，用户可以输入一个号码，并自动获取百分比值：

https://jsfiddle.net/km6Lznex/

（请酌量添加“事件”作为参数在的jsfiddle功能，在使用火狐的情况下）

$('#table').on('keyup', '.update', function (event) { 
    var key = event.keyCode || event.charCode; 
    if(key == 8 || key == 46) return false; 
    calculateTotals(); 
}); 

$('#percent').change(function() { 
    calculateTotals(); 
}); 

function calculateTotals(){ 
    var dscnt_addition_percent = $('#percent'); 
    var dscnt = dscnt_addition_percent.val().trim().replace(/[^0-9$.,]/g, ''); 
    dscnt = dscnt == '' ? 0 : dscnt; 
    dscnt_addition_percent.val(dscnt);  

    var subtotal = parseInt($('#sum').val()); 
    var grandTotal = $('#grandTotal').val(); 
    var m = dscnt_addition_percent.val() * subtotal/100; 
    $('#euro').val(m); 
    $('#grandTotal').val(m + subtotal); 
} 

<div id="table"> 
    € <input type="text" id="euro" placeholder="0,00 €" /><br> 
    % <input type="text" id="percent" value="0" placeholder="0,00 %" /><br> 
    subtotal <input type="text" class="update" id="sum" disabled value="10000" /><br> 
    total <input type="text" class="form-control update" id="grandTotal" placeholder="0,00" /> 

现在我想与T做他textfield为€。当我在金额类型，百分比场和总场应该更新

Answer 1

当您更改#percent它#grandTotal和#euro以输入作为#sum和#percent计算新的价值。现在你改变#euro时想同样的事情，服用本身和#sum作为输入。由于您现在正在计算％，所以您需要将该函数稍微改变一点 即。

时#percent改变euro = percent * subtotal/100;

时#euro改变percent = euro * 100/subtotal;

所以要么你可以使用一个单独的功能或用途相同与even.target告诉到底哪个文本框是事件的起源

function calculateTotals(event) 
{ 
    var dscnt_addition_percent = $('#percent'); 
    ... 
    .. 
    . 

    if(event.target.id=="percent") 
    { 
    //CALCULATE € 
    } 

    if(event.target.id=="euro") 
    { 
    //CALCULATE % 
    var euro = $("#euro").val(); 
    var subtotal = parseInt($('#sum').val()); 

    var percent= euro * 100/subtotal; 
    dscnt_addition_percent.val(percent); 
    $('#grandTotal').val(euro + subtotal); 
    } 

} 

这里几乎没什么变化

$('#table').on('keyup', '.update', function (event) { 
    var key = event.keyCode || event.charCode; 
    if(key == 8 || key == 46) return false; 
    calculateTotals(event); 
}); 

$('#percent,#euro').change(function (event) { 
    calculateTotals(event); 
});