ToggleEvent: ToggleEvent() constructor

Baseline 2024

Newly available

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

The ToggleEvent() constructor creates a new ToggleEvent object.

Syntax

js
new ToggleEvent(type, init)

Parameters

type

A string representing the type of event. In the case of ToggleEvent this is always toggle.

init

An object containing the following properties:

newState

A string representing the state the element is transitioning to. Possible values are "open" and "closed".

oldState

A string representing the state the element is transitioning from. Possible values are "open" and "closed".

Examples

A developer would not use this constructor manually. A new ToggleEvent object is constructed when a handler is invoked as a result of a relevant event firing.

For example:

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");
  }
});

Specifications

Specification
HTML Standard
# toggleevent

Browser compatibility

BCD tables only load in the browser

See also