Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten.Erfahre mehr über dieses Experiment.
HTMLFormElement: formdata Ereignis
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2021.
Dasformdata Ereignis wird ausgelöst, nachdem die Eintragsliste, die die Daten des Formulars darstellt, erstellt wurde. Dies geschieht, wenn das Formular abgeschickt wird, kann aber auch durch den Aufruf einesFormData() Konstruktors ausgelöst werden.
Dieses Ereignis kann nicht abgebrochen werden und breitet sich nicht aus.
Syntax
Verwenden Sie den Ereignisnamen in Methoden wieaddEventListener() oder setzen Sie eine Ereignis-Handler-Eigenschaft.
addEventListener("formdata", (event) => { })onformdata = (event) => { }Ereignistyp
EinFormDataEvent. Erbt vonEvent.
Ereigniseigenschaften
Erbt Eigenschaften von seiner Elternschnittstelle,Event.
FormDataEvent.formDataEnthält das
FormDataObjekt, das die im Formular enthaltenen Daten repräsentiert, als das Ereignis ausgelöst wurde.
Beispiele
// grab reference to formconst formElem = document.querySelector("form");// submit handlerformElem.addEventListener("submit", (e) => { // on form submission, prevent default e.preventDefault(); console.log(formElem.querySelector('input[name="field1"]')); // FOO console.log(formElem.querySelector('input[name="field2"]')); // BAR // construct a FormData object, which fires the formdata event const formData = new FormData(formElem); // formdata gets modified by the formdata event console.log(formData.get("field1")); // foo console.log(formData.get("field2")); // bar});// formdata handler to retrieve dataformElem.addEventListener("formdata", (e) => { console.log("formdata fired"); // modifies the form data const formData = e.formData; // formdata gets modified by the formdata event formData.set("field1", formData.get("field1").toLowerCase()); formData.set("field2", formData.get("field2").toLowerCase());});Dieonformdata Version würde folgendermaßen aussehen:
formElem.onformdata = (e) => { console.log("formdata fired"); // modifies the form data const formData = e.formData; formData.set("field1", formData.get("field1").toLowerCase()); formData.set("field2", formData.get("field2").toLowerCase());};Spezifikationen
| Specification |
|---|
| HTML # event-formdata |
Browser-Kompatibilität
Siehe auch
- HTML
<form>Element FormDataEvent