Почему кнопка нажата при отправке формы?

Question

Скажем, у меня есть форма с текстовым вводом и кнопкой отправки.

Если в форме нет кнопок, просто отправьте триггеры событий, но если есть хотя бы одна кнопка без атрибута типа или с type="submit", она также нажимает на нее.

Теперь, когда я ввожу что-то на вкладке и затем нажимаю Enter, я вижу, что запускаются как нажатия кнопки, так и формы отправки.

Пример:

<form> 
 
    <input type="text" /> 
 
    <button onclick="alert('submitted');">Submit</button> 
 
</form>

Я полагаю, что форма автоматически нажимает на кнопку отправки формы событие.

Мне интересно происхождение и причина такого поведения? Зачем нужна кнопка, которую нужно нажать, когда я отправлю форму?

Answer 1

From the spec:

4.10.22.2 Implicit submission

Если агент пользователя поддерживает позволяя пользователю отправить форму неявно (например, на некоторых платформах, попадающего на клавишу «Ввод», а текстовое поле сфокусировано неявно представляет форму), то делать это для формы чья кнопка по умолчанию имеет определенное поведение активации, должна заставить пользовательский агент запускать синтетические шаги активации щелчка по этой кнопке по умолчанию.

6.3 [synthetic click] Activation

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

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

See full script here

---

Так нажав Enter обрабатывается как говорят submit в микрофон (с устройством ввода голосом). Ваш браузер должен вести себя так, как если бы пользователь нажал кнопку, чтобы правильно обработать связанные с нажатием кнопки функции и улучшить доступность для тех, кто не может использовать мышь.

Answer 2

Это фактически не автоматически нажимает кнопку, это не то, что подает форму. Форма отправляется, потому что это стандартная характеристика текстовых полей - если у вас есть фокус в текстовом поле, нажатие клавиши ввода приведет к попытке отправить форму. Эта статья входит в более глубокое объяснение: https://www.tjvantoll.com/2013/01/01/enter-should-submit-forms-stop-messing-with-that/

EDIT: На самом деле, более конкретно, форма будет представлять только на клавишу ввода, если: 1) кнопка отправки существует в форме, или 2) Форма только содержит один вход текстовых

Если ни одно из этих условий истинно, то введите ключ не должен отправить форму