HTMLFormElement: submit-Ereignis

Baseline Weitgehend verfügbar

Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit Juli 2015 browserübergreifend verfügbar.

Mehr erfahren
Vollständige Kompatibilität anzeigen

Das submit-Ereignis wird ausgelöst, wenn ein <form> übermittelt wird.

Beachten Sie, dass das submit-Ereignis auf dem <form>-Element selbst ausgelöst wird und nicht auf einem <button> oder <input type="submit"> innerhalb des Formulars. Allerdings enthält das SubmitEvent, das gesendet wird, um die Aktion der Formularübermittlung anzuzeigen, eine submitter-Eigenschaft, die der Button ist, der aufgerufen wurde, um die Übermittlungsanfrage auszulösen.

Das submit-Ereignis wird ausgelöst, wenn:

der Benutzer einen Submit-Button klickt,
der Benutzer Enter drückt, während er ein Feld (z.B. <input type="text">) in einem Formular bearbeitet,
ein Skript die Methode form.requestSubmit() aufruft

Das Ereignis wird jedoch nicht an das Formular gesendet, wenn ein Skript die Methode form.submit() direkt aufruft.

Hinweis: Der Versuch, ein Formular zu übermitteln, das die Validierung nicht besteht, löst ein invalid-Ereignis aus. In diesem Fall verhindert die Validierung die Formularübermittlung, und daher gibt es kein submit-Ereignis.

Syntax

Verwenden Sie den Ereignisnamen in Methoden wie addEventListener(), oder setzen Sie eine Ereignishandler-Eigenschaft.

addEventListener("submit", (event) => { })

onsubmit = (event) => { }

<form id="form">
  <label>Test field: <input type="text" /></label>
  <br /><br />
  <button type="submit">Submit form</button>
</form>
<p id="log"></p>

JavaScript

const form = document.getElementById("form");
const log = document.getElementById("log");

function logSubmit(event) {
  log.textContent = `Form Submitted! Timestamp: ${event.timeStamp}`;
  event.preventDefault();
}

form.addEventListener("submit", logSubmit);