1. Web
  2. Web API
  3. ToggleEvent

ToggleEvent

Baseline 2023
新推出

自 ⁨2023 年 11 月⁩ 起，此功能可在最新的设备和浏览器版本中运行。此功能可能不适用于较旧的设备或浏览器。

ToggleEvent 接口表示一个事件，用于通知用户某个元素的状态已更改。

这是 HTMLElement 的 beforetoggle 和 toggle 事件的事件对象，它们分别在某些元素显示和隐藏之间过渡之前和之后触发。

Event ToggleEvent

构造函数

ToggleEvent()

创建一个 ToggleEvent 对象。

实例属性

此接口继承了其父接口 Event 的属性。

ToggleEvent.newState 只读

一个字符串（可以是 "open" 或 "closed"），表示元素正在转换到的状态。

ToggleEvent.oldState 只读

一个字符串（可以是 "open" 或 "closed"），表示元素正在从中转换的状态。

ToggleEvent.source 只读

一个 Element 对象实例，表示触发切换的 HTML 控件。

示例

基本示例

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

规范

规范
HTML
# toggleevent

浏览器兼容性

另见

帮助改进 MDN

了解如何贡献

此页面最后修改于 ，由 MDN 贡献者 修改。

在 GitHub 上查看此页面 • 报告此内容的问题
© . Content available under a Creative Commons license.