HTMLElement : évènement beforetoggle
Baseline
2024
Newly available
Depuis April 2024, cette fonctionnalité fonctionne sur les appareils et les versions de navigateur les plus récents. Elle peut ne pas fonctionner sur les appareils ou navigateurs plus anciens.
L'évènement beforetoggle de l'interface HTMLElement se déclenche sur un élément popover (c'est-à-dire un élément qui a un attribut popover valide) juste avant qu'il ne soit affiché ou masqué.
- Si le popover passe de masqué à affiché, la propriété
event.oldStatesera définie surclosedet la propriétéevent.newStatesera définie suropen. - Si le popover passe d'affiché à masqué, alors
event.oldStatesera définie suropenetevent.newStatesera définie surclosed.
Syntaxe
Utilisez le nom de l'évènement dans des méthodes comme addEventListener(), ou définissez une propriété de gestionnaire d'évènement.
addEventListener("beforetoggle", (event) => {});
onbeforetoggle = (event) => {};
Type d'évènement
ToggleEvent. Hérite de Event.
Exemples
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é");
}
});
Une note sur l'agrégation des évènements de basculement
Il convient de souligner que les évènements beforetoggle sont agrégés, ce qui signifie que si plusieurs évènements beforetoggle sont déclenchés avant que la boucle d'évènements ait eu la possibilité de s'exécuter, un seul évènement sera déclenché.
Par exemple :
popover.addEventListener("beforetoggle", () => {
//…
});
popover.showPopover();
popup.hidePopover();
// `beforetoggle` ne se déclenche qu'une seule fois
Spécifications
| Specification |
|---|
| HTML # event-beforetoggle |
Compatibilité des navigateurs
Chargement…
Voir aussi
- L'API Popover
- L'évènement associé :
toggle