HTMLMediaElement: loadeddata

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

loadeddata 事件在媒体当前播放位置的视频帧(通常是第一帧)加载完成后触发。

基本信息

是否冒泡
是否可取消
接口 Event
目标 元素
默认行为
事件处理器属性 GlobalEventHandlers.onloadeddata

备注: 若在移动/平板设备的浏览器设置中开启了流量节省(data-saver)模式,该事件则不会被触发。

示例

以下示例展示了如何为媒体元素(HTMLMediaElement)的 loadeddata 事件添加一个事件监听器,以在该事件触发时发送一条消息。

使用 addEventListener()

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

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

使用 onloadeddata 事件处理器属性:

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

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

规范

Specification
HTML Standard
# event-media-loadeddata
HTML Standard
# handler-onloadeddata

浏览器兼容性

BCD tables only load in the browser

相关事件

参见