ToggleEvent: newState プロパティ

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.

Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

newStateToggleEvent インターフェイスの読み取り専用プロパティで、この要素が遷移した後の状態を表す文字列です。

文字列です。取りうる値は "open"(ポップオーバーが表示されている)または "closed"(ポップオーバーが非表示になっている)です。

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

仕様書

Specification
HTML Standard
# dom-toggleevent-newstate

ブラウザーの互換性

BCD tables only load in the browser

関連情報