Нажатие Enter всегда отправляет форму

Question

У меня есть простое текстовое поле и кнопка ввода типа на моей странице.

 <input id="sText" type="text" />
 <input id="sButton" type="button" value="button" />

Я фиксирую нажатие кнопки с помощью jQuery.

  $("[id$=sButton]").click(function () {

      ...do Stuff  

  });

Приведенный выше код работает нормально, пока я вручную нажимаю кнопку. Я начал сталкиваться с проблемами, когда я хотел использовать клавишу «Ввод», чтобы нажать кнопку. Что бы я ни делал, я не могу помешать клавише ввода выполнить функцию отправки по умолчанию.

Первым делом я изменил тип ввода с «отправить» на «кнопку».

Я попытался установить отправку формы на onsubmit="return false;"

Я попытался использовать jQuery для захвата события ввода:

 $("#sText").keyup(function (event) {
        if (event.keyCode == 13) {
            alert("Enter!");
            // $("#sButton").click();
        }
    });

Каждый раз, когда я нажимаю клавишу ввода, как будто я отправляю форму, вся страница обновляется. Приведенный выше код jQuery фиксирует нажатие клавиши «ввод», но форма все еще отправляет и обновляет страницу.

Я не уверен, что происходит.

Answer 1

Вам необходимо отменить действие.

event.preventDefault();

НО Я считаю, что вы можете убить отправку формы только с помощью keydown, но не keyup.

Answer 2

Epascarello прав, вам нужно отменить отправку с кодом, который он дал вам. Но вам также следует изменить кнопку обратно на тип отправки, чтобы клавиша ENTER и нажатие кнопки делали одно и то же. Таким образом, вы можете справиться только с отменой отправки в одной области.

<input id="sButton" type="submit" value="Submit" />

JQuery:

$("#YourFormId").submit(function(event){

      event.preventDefault();
      ...do Stuff  

  });

Таким образом, одна функция обрабатывает клавишу ВВОД и нажатие кнопки.

РЕДАКТИРОВАТЬ: Поставьте event.preventDefault () в качестве первого оператора.