Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.

View in English Always switch to English

ToggleEvent

Baseline 2023 *
Neu verfügbar

Seit November 2023 funktioniert diese Funktion auf aktuellen Geräten und in aktuellen Browserversionen. Auf älteren Geräten oder in älteren Browsern funktioniert sie möglicherweise nicht.

* Einige Teile dieser Funktion werden möglicherweise unterschiedlich gut unterstützt.

Die ToggleEvent-Schnittstelle stellt ein Ereignis dar, das ausgelöst wird, wenn ein Popover-Element ein- oder ausgeblendet wird.

Dies ist das Ereignisobjekt für die beforetoggle und toggle-Ereignisse, die auf Elementen wie folgt ausgelöst werden:

  • Das beforetoggle-Ereignis wird ausgelöst, bevor Popover oder <dialog>-Elemente ein- oder ausgeblendet werden.
  • Das toggle-Ereignis wird ausgelöst, nachdem Popover-, <dialog>- oder <details>-Elemente ein- oder ausgeblendet wurden.
Event ToggleEvent

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 darstellt, zu dem das Element wechselt.

ToggleEvent.oldState Schreibgeschützt

Ein String (entweder "open" oder "closed"), der den Zustand darstellt, von dem das Element wechselt.

ToggleEvent.source Schreibgeschützt

Eine Instanz des Element-Objekts, die das HTML-Steuerelement repräsentiert, das das Umschalten initiiert hat.

Beispiele

Einfaches Beispiel

js
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

Spezifikation
HTML
# toggleevent

Browser-Kompatibilität

Siehe auch