HTMLMediaElement：loadeddata 事件

Baseline 已广泛支持

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

当媒体当前播放位置的帧已完成加载时，会触发 loadeddata 事件；通常是第一帧。

注意： 如果浏览器设置中的数据节省程序已打开，此事件在移动/平板设备上将不会触发。

语法

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

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

onloadeddata = (event) => { }

事件类型

一个通用的 Event。

示例

这些示例为 HTMLMediaElement 的 loadeddata 事件添加了一个事件监听器，然后当事件处理程序响应事件触发时发布一条消息。

使用 addEventListener()

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

video.addEventListener("loadeddata", (event) => {
  console.log(
    "Yay! The readyState just increased to  " +
      "HAVE_CURRENT_DATA or greater for the first time.",
  );
});

使用 onloadeddata 事件处理程序属性

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

video.onloadeddata = (event) => {
  console.log(
    "Yay! The readyState just increased to  " +
      "HAVE_CURRENT_DATA or greater for the first time.",
  );
};