Warum eine Schaltfläche geklickt wird, wenn ein Formular gesendet wird?

Question

Angenommen, ich habe ein Formular mit einer Texteingabe und einem Senden-Button.

Wenn keine Schaltflächen im Formular vorhanden sind, senden Sie nur Ereignisauslöser, aber wenn mindestens eine Schaltfläche ohne Typattribut oder mit type="submit" vorhanden ist, wird auch darauf geklickt.

Jetzt, wenn ich etwas in die Eingabe eingeben und dann die Eingabetaste drücken, sehe ich, dass beide Schaltflächen klicken und Formular senden Ereignisse ausgelöst werden.

Beispiel:

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

Ich nehme an, die Form auf die Schaltfläche klickt automatisch auf dem Formular Veranstaltung einzureichen.

Ich wundere mich über die Ursprünge und den Grund für ein solches Verhalten? Warum brauche ich den Button, um angeklickt zu werden, wenn ich das Formular abschicke?

Answer 1

From the spec vorlegen sollte:

4.10.22.2 Implicit submission

Wenn die User-Agent unterstützt die Benutzer implizit ein Formular einreichen zu lassen (zum Beispiel auf einigen Plattformen die „Enter“ Taste drücken, während ein Textfeld einreicht fokussiert wird implizit die Form), dann so eine Form zu tun Wenn die Standardschaltfläche ein definiertes Aktivierungsverhalten aufweist, muss der Benutzeragent synthetische Klickaktivierungsschritte für diese Standardschaltfläche ausführen.

6.3 [synthetic click] Activation

Bestimmte Elemente in HTML haben eine Aktivierungsverhalten, was bedeutet, dass der Benutzer sie aktivieren kann. Dies löst eine Sequenz von Ereignissen aus, die von dem Aktivierungsmechanismus abhängig ist und normalerweise in einem Klickereignis gipfelt, wie nachstehend beschrieben.

Der Benutzeragent sollte dem Benutzer ermöglichen, Elemente mit einem Aktivierungsverhalten manuell auszulösen, z. B. über Tastatur oder Spracheingabe oder durch Mausklicks. Wenn der Benutzer ein Element mit einem definierten Aktivierungsverhalten auf eine andere Weise als durch Klicken auslöst, muss die Standardaktion des Interaktionsereignisses darin bestehen, synthetische Klickaktivierungsschritte für das Element auszuführen.

See full script here

---

So Enter Pressen wird mit den Worten submit in das Mikrofon (mit einer Spracheingabeeinrichtung) verarbeitet. Ihr Browser sollte sich so verhalten, als hätte der Benutzer auf die Schaltfläche geklickt, um die Funktionen zum Anhängen von Klickereignissen ordnungsgemäß zu verarbeiten und die Barrierefreiheit für Benutzer zu verbessern, die keine Maus verwenden können.

Answer 2

Es tatsächlich nicht automatisch die Taste drücken, das ist nicht, was das Senden des Formulars ist. Das Formular wird gesendet, da dies eine Standardeigenschaft von Textfeldern ist. Wenn Sie den Fokus im Textfeld haben, wird durch Drücken der Eingabetaste versucht, das Formular zu senden. Dieser Artikel geht in eine tiefere Erklärung: https://www.tjvantoll.com/2013/01/01/enter-should-submit-forms-stop-messing-with-that/

EDIT: Eigentlich, genauer gesagt, wird ein Formular nur auf der Enter-Taste einreichen, wenn: 1) Eine Submit-Button in der Form vorhanden ist, oder 2) die Form nur keine dieser Bedingungen enthält eine Texteingabe

Wenn wahr ist, dann geben Sie den Schlüssel nicht die Form