jQuery 函数适用于 chrome 但不适用于其他浏览器答案

【问题标题】：jQuery function works in chrome but not other browserjQuery 函数适用于 chrome 但不适用于其他浏览器
【发布时间】：2015-09-02 01:44:45
【问题描述】：

因此，在用户输入电话号码后，我试图让表单更正电话号码。

例如，表单只会让他们输入数字，没有其他内容。因此，当他们键入 1234567890 时，它将在焦点输出上将其重新格式化为 (123) 456-7890。

如果我要在另一个浏览器中运行它，它会显示为 ((12) 3) -456-，因为它会在聚焦后再次重新运行代码，所以它会执行两次。

我可以在 chrome 上做到这一点，但它在任何其他浏览器中都不起作用。

这是我的代码：

$('#number').focusin(number_remove);
$('#number').keyup(number_check);
$('#number').focusout(number_add);

    function number_remove() {
    var number = $('#number').val();
    var newnumber = number.replace(/\D/g,'');
    $('#number').val(newnumber);
}

function number_check() {
    var number = $('#number').val();
    if(number != '') {
        var newnumber = number.replace(/\D/g,'');
        $('#number').val(newnumber);
        if(number.length >= 10) {
            $('#number').css('background', 'rgba(54, 255, 0, 0.1)');
        }else{
            $('#number').css('background', 'rgba(255, 0, 0, 0.1)');
        }
    }else{
        $('#number').css('background', 'rgba(128, 128, 128, 0.1)');
    }
}

function number_add() {
    var number = $('#number').val();
    if(number != ''){
        var numbersub1 = number.substring(0, 3);
        var numbersub2 = number.substring(3, 6);
        var numbersub3 = number.substring(6, 10);
        var finalnumber = '('+numbersub1+') '+numbersub2+'-'+numbersub3;
        $('#number').val(finalnumber);
    }
}

【问题讨论】：

@DyrandzFamador 在其他浏览器中，如果我输入 1234567890，它会在运行函数时显示在 ((12) 3) -456- 处。
idk，在我的 mozilla 中工作 jsfiddle.net/cuw303dy/1
如果我添加延迟，我发现它实际上适用于每个浏览器，但它不适用于我的 firefox 或 safari..我不知道为什么
在评论中，它在您的浏览器中不起作用？（没有延误）

标签： javascript jquery google-chrome

【解决方案1】：

试试这个。我对您的代码进行了一些更改。基本上我所做的是我使用 On http://api.jquery.com/on/ 将一个事件附加到文本框

为了避免在其他浏览器中多次触发焦点，我添加了 e.stopPropagation();

您可以在 http://jsfiddle.net/3v1mmepo/5/ 上找到工作示例

$('#number').on("focus", function () {
    var number = $(this).val();
    var newnumber = number.replace(/\D/g, '');
    $(this).val(newnumber);
});

$('#number').on("keyup", function () {
    var number = $(this).val();
    if (number != '') {
        var newnumber = number.replace(/\D/g, '');
        $(this).val(newnumber);
        if (number.length >= 10) {
            $(this).css('background', 'rgba(54, 255, 0, 0.1)');
        } else {
            $(this).css('background', 'rgba(255, 0, 0, 0.1)');
        }
    } else {
        $(this).css('background', 'rgba(128, 128, 128, 0.1)');
    }
});

$('#number').on("focusout", function (e) {
    var number = $(this).val();
    if (number != '') {
        var numbersub1 = number.substring(0, 3);
        var numbersub2 = number.substring(3, 6);
        var numbersub3 = number.substring(6, 10);
        var finalnumber = '(' + numbersub1 + ') ' + numbersub2 + '-' + numbersub3;
        $(this).val(finalnumber);
    }
    e.stopPropagation();
});

【讨论】：