Как сделать автоматический переход на следующий input?

Question

[Victor0816]

Привет, друзья!
В форме есть 4 input, эти input в разных div
Как сделать что бы при заполнении input фокус перекидывало на следующий

Нашел код, но он работает только если все input в одном div, что для меня не подходит, а перепилить его хз как

$('input').keyup(function(){
  if($(this).val().match(/^\d{1}$/)){
    $(this).next('input').focus();
  }else{
    $(this).val('');
  }
});

Comments

[Константин Гусев]

Там код, то вроде правильный и должен на все <input> отзываться или я читать код разучился?

[Victor0816]

Константин Гусев, работает только если в одном div
В разных div на keyup срабатывает, но фокус не меняет
почему я не понимаю

[Надим]

Константин Гусев, next работает опираясь на текущий уровень вложенности тегов, по идее. Надо переписать так. Сначала ищем все поля, что есть на странице, получаем массив. Далее перебираем массив в цикле, когда при переборе натыкаемся на текущий элемент, следующий элемент считаем тем полем, в который и надо переместить фокус.

Answer 1

[Константин Гусев]

// Исходная логика
$('input').keyup(function(){
  if($(this).val().match(/^\d{1}$/))
    $(this).next('input').focus();
  else
    $(this).val('');
  // Находим следующий элемент input
  var nextInput = $(this).nextAll('input').first();
  // Если следующий элемент input существует, то устанавливаем на него фокус
  if (nextInput.length)
    nextInput.focus();
});

Comments

[Victor0816]

Пробовал и nexall, единственное без .first
Но не работает, бог с ним)
Спасибо за помощь)

Answer 2

[Иван]

А если так?

$('input').keyup(function(){
  if($(this).val().match(/^\d{1}$/)){
    $(this).closest('div').next('div').find('input').focus();
  }else{
    $(this).val('');
  }
});