首页 > 解决方案 > Jquery onkeyup 或 onchange 函数取决于 HTML 表单中的值

问题描述

我有三个字段amountamount with taxtax (%),当用户输入% amount 时,它会通过 keyUp 事件函数自动计算。当用户将金额与税值四舍五入并再次通过按TAB键提交时会出现问题。它检测 Keyup 事件并将值更改为初始值。指导我解决这个问题。

标签: javascriptjqueryhtmlonchangekeyup

解决方案


您会注意到,如果您想通过四舍五入税额来实现您所寻找的内容,则字段也会因为onkeyup您应用的事件而更新,这意味着这已经变成了一个链接事件。一旦用户打算手动更改税额,我已经在代码中应用了一些更改来触发税字段的值,如下所示:

calculateTotal = function(){
   var total = 0.00;
   var amount = $("#amount").val();
   var amount_with_tax = $("#amount_with_tax").val();
   amount = parseFloat(amount);
   amount_with_tax = parseFloat(amount_with_tax);
   total = amount + amount_with_tax;
   var tax = (100-(amount/total)*100).toFixed(2);
   console.log(total);
   $('#tax').val(tax);
   $('#total').text(total.toFixed(2));
}

另请注意,在这种情况下onkeyupevent 不是一个好的事件侦听器,因为这些函数都以字段值依赖的方式链接。因此,我将事件侦听器更改为仅当用户关注输入字段或关注输入字段时才会触发事件。onchange


推荐阅读