Question

所以我想在用户输入他们的号码后让表格更正一个电话号码。

例如，表单只允许他们输入数字，没有其他内容。因此，当他们键入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);
    }
}

Answer 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();
});

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

1 个答案: