Почему моя функция js не работает на компьютере, а не на телефоне?

Question

Я должен автоматически фокусировать следующий элемент ввода, когда число было введено.

Мой HTML:

          "<input id='num-1' class='inp-num' data-pos='0' type='text' maxlength='1' name='one' onkeypress='isInputNumber(event)' autofocus='autofocus'/>" +
          "<input id='num-2' class='inp-num' data-pos='1' type='text' maxlength='1' name='two' onkeypress='isInputNumber(event)'>" +
          "<input id='num-3' class='inp-num' data-pos='2' type='text' maxlength='1' name='three' onkeypress='isInputNumber(event)'>" +
          "<input id='num-4' class='inp-num' data-pos='3' type='text' maxlength='1' name='four' onkeypress='isInputNumber(event)'>" +

И в моем JavaScript есть:

  $('.inp-num').on('keyup', function() {
    if ($(this).val()) {
       $(this).next().focus();
     }
  });

Это на самом деле работает нормально, дело в том, что когда я пытаюсь использовать его на своем мобильном телефоне, он продолжает оставаться на том же входе, не переходя к следующему. Мне действительно нужна помощь в этом.

Спасибо!

Answer 1

Браузер вашего мобильного телефона не получил значение внутри элемента ввода до того, как сработало событие keyup. Поэтому if ($(this).val()) является ложным в это время. Вам нужно использовать другой тип события (например, input), чтобы избежать этого.

Дополнительная информация и детская площадка:

https://www.w3schools.com/jsref/event_onchange.asp

$('.inp-num').on('input', function() {
 if ($(this).val()) {
   $(this).next().focus();
 }
});