JQuery Code适用于Firefox,Opera,但不适用于Chrome和IE

时间:2013-04-08 18:51:42

标签: javascript jquery cross-browser

我有以下代码适用于Firefox-20和Opera,但不适用于Chrome-26或​​IE-10。键盘功能将印度逗号添加到金额中。

$(document).ready(function() {
    $("#readyArea").on('change', function() {
        $("#underConstArea").val($(this).val()).trigger('change');
    });

$('.comma').on('keyup', this, function commaFormatted(){
        var delimiter = ","; // replace comma if desired
        var amount = $(this).val().replace(/\,/g,'');
        var a = amount.split('.',2);
        var d = a[1];
        var i = parseInt(a[0],10);
        if(isNaN(i)) { return ''; }
        var minus = '';
        if(i < 0) { minus = '-'; }
        i = Math.abs(i);
        var n = new String(i);
        var a = [];
        var cnt=0;
        while(n.length > 2)
        {
            if(cnt == 0)
            {
                var nn = n.substr(n.length-3);
                n = n.substr(0,n.length-3);
                cnt++;
            }
            else
            {
                var nn = n.substr(n.length-2);
                n = n.substr(0,n.length-2);
            }
            a.unshift(nn);
        }
        if(n.length > 0)
        {
            a.unshift(n);
        }
        n = a.join(delimiter);
        amount = n;
        amount = minus + amount;
        $(this).val(amount);
    });
});

这是JSFiddle link。 (正如我所说,如果我在Firefox或Opera中打开此链接,js可以工作但不能在Chrome或IE中使用)。控制台上也没有js错误。我是否需要为Chrome和IE做一些特定的事情?

修改

只是为了澄清,这是onChange事件没有在Chrome和IE中触发。在Firefox和Opera中也是如此。

1 个答案:

答案 0 :(得分:1)

我在Chrome上测试过,逗号表现不错,但我从未见过underConstArea更新,而我在离开文本框后确实在Firefox上看到了这样做。

我不确定那里发生了什么,但我有几种方法可以修复它。

首先,似乎$("#readyArea").on('change')是否依赖于浏览器。我不知道为什么,但是当您更改代码时,Chrome似乎不会引发更改事件。也许它试图避免无限循环的变化;我不太确定。

如果您对underConstArea仅在完成号码时更新感到满意(因为它在firefox中的行为),您可以在focusout而不是change上执行此操作。我改变了你的顶线

$("#readyArea").on('focusout', function() {
    $("#underConstArea").val($(this).val());
});

它在Chrome和Firefox中运行良好。 Here是一个更新的小提琴。

或者,如果您希望每次用户输入时都更新,只需在underConstArea功能中更新commaFormatted即可。只需添加

$("#underConstArea").val(amount);

在你的功能底部。 我提供的link到第二个选项。请注意,我删除了#readyArea上的所有事件。