ToggleEvent

Baseline 2023

Newly available

Since November 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Die ToggleEvent-Schnittstelle repräsentiert ein Ereignis, das den Benutzer darüber informiert, dass sich der Zustand eines Elements geändert hat.

Dies ist das Ereignisobjekt für die HTMLElement-beforetoggle und toggle-Ereignisse, die auf einigen Elementen unmittelbar vor und nach dem Übergang zwischen Sichtbarkeit und Verborgenheit ausgelöst werden.

beforetoggle wird bei Popovers und <dialog>-Elementen ausgelöst.
toggle wird bei Popovers, <dialog>-Elementen, und <details>-Elementen ausgelöst.

Konstruktor

ToggleEvent(): Erstellt ein ToggleEvent-Objekt.

Instanz-Eigenschaften

Diese Schnittstelle erbt Eigenschaften von ihrem Elternteil, Event.

ToggleEvent.newState Schreibgeschützt: Ein String (entweder "open" oder "closed"), der den Zustand repräsentiert, zu dem das Element übergeht.
ToggleEvent.oldState Schreibgeschützt: Ein String (entweder "open" oder "closed"), der den Zustand repräsentiert, von dem das Element übergeht.
ToggleEvent.source Experimentell Schreibgeschützt: Eine Element-Objektinstanz, die das HTML-Steuerelement darstellt, das das Umschalten initiiert hat.

Beispiele

Einfaches Beispiel

const popover = document.getElementById("mypopover");

// …

popover.addEventListener("beforetoggle", (event) => {
  if (event.newState === "open") {
    console.log("Popover is being shown");
  } else {
    console.log("Popover is being hidden");
  }
});

Spezifikationen

Specification
HTML # toggleevent