SubmitEvent

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Die SubmitEvent-Schnittstelle definiert das Objekt, das verwendet wird, um ein submit-Ereignis eines HTML-Formulars darzustellen. Dieses Ereignis wird am <form> ausgelöst, wenn die Absendeaktion des Formulars aufgerufen wird.

Event SubmitEvent

Konstruktor

SubmitEvent()

Erstellt und gibt ein neues SubmitEvent-Objekt zurück, dessen type und andere Optionen wie angegeben konfiguriert sind. Beachten Sie, dass derzeit der einzige gültige type für ein SubmitEvent submit ist.

Instanz-Eigenschaften

Zusätzlich zu den unten aufgeführten Eigenschaften erbt diese Schnittstelle die Eigenschaften ihrer Elternschnittstelle Event.

submitter Schreibgeschützt

Ein HTMLElement-Objekt, das die Schaltfläche oder ein anderes Element identifiziert, das aufgerufen wurde, um das Formular abzusenden.

Instanz-Methoden

Obwohl SubmitEvent keine eigenen Methoden anbietet, erbt es alle von seiner Elternschnittstelle Event spezifizierten.

Beispiele

In diesem Beispiel kann ein Warenkorb eine Reihe unterschiedlicher Absende-Schaltflächen haben, abhängig von Faktoren wie den Benutzereinstellungen, den Einstellungen des Shops und möglichen Mindest- oder Höchstgrenzen des Warenkorbs, die von den Zahlungsanbietern festgelegt wurden. Jede der Absendeelemente verwendet die id, um den entsprechenden Zahlungsanbieter zu identifizieren.

js
let form = document.querySelector("form");
form.addEventListener("submit", (event) => {
  let submitter = event.submitter;
  let handler = submitter.id;

  if (handler) {
    processOrder(form, handler);
  } else {
    showAlertMessage(
      "An unknown or unaccepted payment type was selected. Please try again.",
      "OK",
    );
  }
});

Die Handler-ID wird erhalten, indem die submit-Ereignis-Eigenschaft submitter verwendet wird, um die Absende-Schaltfläche zu erhalten, von der wir dann die ID abrufen. Mit dieser Informationen können wir eine processOrder()-Funktion aufrufen, um die Bestellung zu bearbeiten und das Formular sowie die Handler-ID weiterzugeben.

Spezifikationen

Specification
HTML
# the-submitevent-interface

Browser-Kompatibilität

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
SubmitEvent
SubmitEvent() constructor
submitter

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support
Partial support
Partial support
Has more compatibility info.