关于jQuery变化的实时计算

Question

我们正在使用以下字段进行一些计算。

$(document).ready(function(){ 
$('.num').blur(function() { 
var amount = parseInt($('#amount').val()) || 0; 
var openbal = parseInt($('#openbal').val()); 
var disc = parseInt($('#disc').val()); 
var netpay = fees+openbal-disc || 0; 
$('#netpay').val(netpay); 
}); 
}); 

这里是HTML代码

<select name="product" class="product"> 
    <option selected>Select product</option> 
    <option>Product1</option> 
    <option>Product2</option> 
</select> 
<input type="text" size="30" name="amount" class="num" id="amount" /> 
<input type="text" class="num" name="openbal" value="0" id="openbal" /> 
<input type="text" class="num" name="disc" value="0" id="disc" /> 
<input type="text" name="netpay" id="netpay" /> 

所以我们在这里做的是...

1. 从下拉列表中，并获取使用AJAX量（#amount）选择产品。
2. 我们正在计算使用.num(class)像给定的折扣或任何未结余额。

我们的代码工作正常，但它只更新netpay（#netpay），当我们模糊任何.num字段并更新计算。但是我们希望在金额收到其价值后进行计算，如果我们更新num（.num）字段中的任何一个，例如我们给予折扣（#disc）500，那么甚至应该更新netpay（#netpay），所以netpay（#netpay）应该更新。

感谢您的支持。

Answer 1

最简单的方法是将一旦你#amount设置的值提高blur事件。

所以在你success处理程序Ajax调用，这样做：

$('#amount').val('newValue').blur(); 

由于blur事件处理程序也必然要#amount，引发事件将执行它（但你可以使用任何其他元素处理程序绑定到）。

---

不幸的是，.val()设置文本输入元素的值不不提高change事件。

---

进一步备注：

如果使用parseInt，请确保您传递正确的提取物作为第二个参数。所以它应该是parseInt($('#amount').val(), 10)。否则，如果某人输入一个前导0的数字，则该值将被解析为八进制值。如果值是纯数字不带任何后缀，您还可以通过只是在前面加上+解析字符串编号：

var amount = +$('#amount').val() || 0, 
    openbal = +$('#openbal').val() || 0, 
    disc = +$('#disc').val() || 0, 
    netpay = fees + openbal - disc; 
$('#netpay').val(netpay); 

Answer 2

您的意思是它不会在您输入数字输入时更新？

考虑将计算函数分离出来并从不同事件中调用它。

function doCalc() { 
    var fees = 0; // <-- is undefined in your example 
    var amount = parseInt($('#amount').val()) || 0; 
    var openbal = parseInt($('#openbal').val()); 
    var disc = parseInt($('#disc').val()); 
    var netpay = fees + openbal - disc || 0; 
    $('#netpay').val(netpay); // <-- the result is not going anywhere 
} 

$(function(){ 
    $('.num') 
     .blur(doCalc) // keeping your original event 
     .keydown(doCalc) // also updating as they type 
     .change(doCalc) // also update if value changes 
     ; 
}); 

我没有测试这个。我猜这是否是你之后的事情。

Answer 3

尝试使用此：

$('#amount').blur(function()

，而不是这样的：

$('.num').blur(function()