ToggleEvent

Baseline 2025
Newly available

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

L'interface ToggleEvent représente un évènement qui notifie lorsqu'un élément popover change d'état entre visible et masqué.

Cette interface est implémentée par les évènements beforetoggle et toggle émis par HTMLElement lorsqu'un popover change d'état, visible ou masqué (avant et après, respectivement).

Event ToggleEvent

Note : ToggleEvent n'a aucun rapport avec l'évènement toggle de l'élément <details>, qui se déclenche sur un élément <details> lorsque son état open/closed change. Dans ce cas, toggle implémente l'interface générique Event.

Constructeur

ToggleEvent()

Crée un objet ToggleEvent.

Propriétés de l'instance

Cette interface hérite des propriétés de son parent, Event.

ToggleEvent.newState Lecture seule

Une chaîne de caractères (soit "open" soit "closed"), représentant l'état vers lequel l'élément est en train de transitionner.

ToggleEvent.oldState Lecture seule

Une chaîne de caractères (soit "open" soit "closed"), représentant l'état depuis lequel l'élément est en train de transitionner.

Exemples

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

// …

popover.addEventListener("beforetoggle", (event) => {
  if (event.newState === "open") {
    console.log("Le popover est en train d'être affiché");
  } else {
    console.log("Le popover est en train d'être masqué");
  }
});

Spécifications

Specification
HTML
# toggleevent

Compatibilité des navigateurs

BCD tables only load in the browser

Voir aussi