Функция jQuery работает в хромированном, но не в другом браузере

Question

Так что я пытаюсь сделать правильный номер телефона после того, как пользователь вводит их число.

Например, форма позволяет им вводить числа, а не что иное. Итак, когда они набирают 1234567890, он переформатирует его на (123) 456-7890 на фокус.

Если я должен был запустить его в другом браузере, он отображается как ((12) 3) -456-, потому что он снова запускает код после фокуса, чтобы он делал это дважды.

Я смог сделать это на хроме, но он не работает ни в каких других браузерах.

Вот мой код:

$('#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(); 
});