HTMLMediaElement: timeupdate 事件

Baseline 已广泛支持

此特性已相当成熟，可在许多设备和浏览器版本上使用。自 ⁨2015 年 7 月⁩以来，各浏览器均已提供此特性。

当 currentTime 属性指示的时间更新时，会触发 timeupdate 事件。

事件的触发频率取决于系统负载，但大约在 4Hz 到 66Hz 之间（假设事件处理程序的运行时间不超过 250ms）。鼓励用户代理根据系统负载和每次处理事件的平均成本来调整事件的触发频率，以便 UI 更新的频率不会超过用户代理在解码视频时能够舒适处理的频率。

此事件不可取消，也不会冒泡。

语法

在诸如 addEventListener() 之类的方法中使用事件名称，或设置事件处理程序属性。

addEventListener("timeupdate", (event) => { })

ontimeupdate = (event) => { }

事件类型

一个通用的 Event。

示例

这些示例为 HTMLMediaElement 的 timeupdate 事件添加了一个事件监听器，然后在事件处理程序响应事件触发时发送一条消息。请记住，事件的触发频率取决于系统负载。

使用 addEventListener()

const video = document.querySelector("video");

video.addEventListener("timeupdate", (event) => {
  console.log("The currentTime attribute has been updated. Again.");
});

使用 ontimeupdate 事件处理程序属性

const video = document.querySelector("video");

video.ontimeupdate = (event) => {
  console.log("The currentTime attribute has been updated. Again.");
};