实时更改jquery [英] Live calculation on jquery change

问题描述

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

We are using following fields to do some calculation.

$(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" />

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

So What we are doing here is...

1. 从下拉列表中选择产品，并使用ajax提取金额(#amount).
2. 我们正在使用.num(class)进行计算，例如给定折扣或任何未结余额.

1. Select product from drop down list and fetch amount(#amount) using ajax.
2. We are doing calculation using .num(class) like given discount or any pending balance.

我们的代码工作正常，但是仅当我们在任何.num字段上模糊化时，它才更新netpay(#netpay)并更新计算.但是我们想在金额收到其值后进行计算，如果我们更新num(.num)字段中的任何一个，甚至应该更新netpay(#netpay)，例如我们给Discount(#disc)500，所以netpay(#netpay)应该更新.

Our code is working fine, but it only updates netpay(#netpay) when we blur on any .num field and it updates calculation. But we would like to do calculation after amount receives its value and even should update netpay(#netpay) if we updates any of num(.num) field, for example we give discount(#disc) 500, so netpay(#netpay) should be updated.

感谢您的支持.

推荐答案

最简单的方法是在设置#amount的值后引发blur事件.

The easiest way would be to raise the blur event once you set the value for #amount.

因此，在用于Ajax调用的success处理程序中，执行以下操作:

So in your success handler for the Ajax call, do something like:

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

由于blur事件处理程序也绑定到#amount，因此引发事件将执行该事件(但是您可以使用该处理程序绑定到的任何其他元素).

As the blur event handler is also bound to #amount, raising the event will execute it (but you could use any other element the handler is bound to).

不幸的是，使用.val()设置文本输入元素的值不会不引发change事件.

Unfortunately, setting the value of a text input element with .val() does not raise the change event.

更多评论:

如果使用parseInt，请确保将正确的基数作为第二个参数传递.因此应该为parseInt($('#amount').val(), 10).否则，如果有人输入以0开头的数字，则该值将解析为八进制值.如果值是无后缀的纯数字，则还可以通过仅在+:

If you use parseInt, make sure you pass the right radix as second parameter. So it should be parseInt($('#amount').val(), 10). Otherwise, if someone inputs a number with leading 0s, the value is parsed as octal value. If the values are plain numbers without any suffix, you can also parse the string as number by just prepending +:

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

这篇关于实时更改jquery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！