A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from http://developer.mozilla.org/ja/docs/Web/API/HTMLElement/beforetoggle_event below:

HTMLElement: beforetoggle イベント - Web API

HTMLElement: beforetoggle イベント

Baseline 2024 *

Newly available

beforetoggle は HTMLElement インターフェイスのイベントで、ポップオーバー要素(すなわち有効な popover 属性がある要素)において、表示または非表示になる直前に発行されます。

構文

このイベント名を addEventListener() 等のメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。

addEventListener("beforetoggle", (event) => {});

onbeforetoggle = (event) => {};
イベント型

ToggleEvent です。Event から継承しています。

Event ToggleEvent 例 基本的な例
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");
  }
});
トグルイベントの合体に関するメモ

beforetoggle イベントが合体していることを特筆に値するでしょう。イベントループが循環する前に複数の beforetoggle イベントが発行された場合、単一のイベントしか発行されないということです。

例えば次のようになります。

popover.addEventListener("beforetoggle", () => {
  //...
});

popover.showPopover();
popover.hidePopover();
// `beforetoggle` は 1 回しか発行されない
仕様書 ブラウザーの互換性 関連情報

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4