jQuery不兼容input的change事件问题解决过程
jquery在项目里是干啥的最近开发⼀个项⽬，需要实现⽤户在WEB表单⾥的多个INPUT框中输⼊数量后，⽴即⾃动计算加总各项输⼊的数量之和，并显⽰在指定的INPUT框中，这个功能实现的原理是简单的，就是只需要在INPUT的onchange事件中计算加总并将结果赋给指定的INPUT框中即可实现，代码如下：
复制代码代码如下:
$("input.syxcost").change(function(){
computeReceivedsyxcost();
}
function computeReceivedsyxcost(){  //计算加总
var syxcost=0;
$("input.syxcost").each(function(){
var cost=parseFloat($(this).val());
if (!isNaN(cost))
syxcost=syxcost + cost;
});
$("#receivedsyxcost").val(syxcost); //显⽰最终结果
}
原以为这样就解决了，在⾕歌浏览器确实是OK的，但在IE 9中，却发现在INPUT中输⼊数量后，并不会⽴即触发change事件，存在兼容问题，在⽹上搜了许多，也都说存在这个问题，没有办法，我就只有⾃⼰来依据实现情况来写，我的思路是：当INPUT获取焦点时，就获取当前的VALUE并存⼊该INPUT的⾃定义的属性中（如：data-oval），然后在INPUT失去焦点的时候，就获取当前的VALUE与之前存在⾃定义的属性中的值是否相同，若不相同，则说明VALUE被改变，就需要重新计算，否则忽略，实现代码如下：
复制代码代码如下:
$("input.syxcost").focus(function(){
$(this).attr("data-oval",$(this).val()); //将当前值存⼊⾃定义属性
}).blur(function(){
var oldVal=($(this).attr("data-oval")); //获取原值
var newVal=($(this).val()); //获取当前值
if (oldVal!=newVal)
{
computeReceivedsyxcost(); //不相同则计算
}
});
经反复验证，在所有的浏览器下均显⽰正常，解决了兼容的问题！

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。