Как предотвратить переход клавиши табуляции к следующему полю формы?

Question

У меня проблема: я создаю многостадийную форму на странице.Каждая «сцена» находится на отдельной панели (div).Я буду перемещаться по панелям с помощью javascript (кнопки «следующий / предыдущий»).Каждая панель имеет свою собственную проверку, и невозможно перейти к следующей панели, если текущая не была успешно проверена.Все хорошо.

Проблема в том, что пользователь начинает использовать вкладки для перехода с одного поля на другое.Когда он достигает последнего поля текущей панели, вкладка переносит его на следующую панель.

Поэтому мне нужно избегать последнего поля каждой формы для принятия событий табуляции или первогополе каждой формы должно быть доступно на вкладке.Или т.п.

Другими словами: как отключить клавишу табуляции только для определенных полей?Или, как ограничить действие табуляции только определенной группой полей в форме?

Я пробовал несколько способов, не повезло:

// on last panel field
$('.block-tab').on('keypress', function(e) { 
  if (e.keyCode == 9) e.preventDefault();
});

// on first panel field
$('.block-tab').on('keyup', function(e) { 
  if (e.keyCode == 9) e.preventDefault(); 
});

Answer 1

Как подсказывает @Teemu, onkeydown будет работать.В общем, в последнем поле каждой панели / вкладки я назначу такой класс, как «блок-вкладка».

<input class="block-tab" name="email" id="email" type="text"  value="" />

Затем:

$('.block-tab').on('keydown', function(e) { 
  if (e.keyCode == 9) e.preventDefault(); 
});

Это позволит пользователю получить доступ к следующей панели без нажатия кнопки «Далее» и, таким образом, сначала проверить текущую панель.