Перебіг необхідності фіксувати та перевіряти кожне натискання клавіші ENTER дійсно мене помиляє, тому моє рішення покладається на таку поведінку браузера:
Натискання клавіші ENTER призведе до події клацання на кнопці подання (перевірена в IE11, Chrome 38, FF 31) ** (посилання: http://mattsnider.com/how-forms-submit-when-pressing-enter/ )
Тому моє рішення полягає в тому, щоб видалити стандартну кнопку подання (тобто <input type="submit">
), щоб вищезгадана поведінка вийшла з ладу, оскільки немає кнопки подання, щоб магічно натискати при натисканні клавіші ENTER. Натомість я використовую обробник клацань jQuery на звичайній кнопці, щоб подати форму за допомогою .submit()
методу jQuery .
<form id="myform" method="post">
<input name="fav_color" type="text">
<input name="fav_color_2" type="text">
<button type="button" id="form-button-submit">DO IT!</button>
</form>
<script>
$('#form-button-submit').click(function(){
$('#myform').submit();
});
</script>
Демонстрація: http://codepen.io/anon/pen/fxeyv?editors=101
** така поведінка не застосовується, якщо форма має лише 1 поле введення, і це поле є текстовим вводом; у цьому випадку форма буде подана за допомогою клавіші ENTER, навіть якщо в розмітці HTML немає кнопки подання (наприклад, у полі пошуку). Це було стандартною поведінкою браузера з 90-х років.