HTMLMediaElement: loadeddata イベント

loadeddata イベントは、メディアの現在の再生位置のフレームの読み込みが完了したときに発生します。ふつうは最初のフレームです。

メモ: なお、このイベントはモバイルやタブレットにおいて、ブラウザーの設定でデータセーバーがオンになっていると発生しません。

構文

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

js

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

onloadeddata = (event) => {};

イベント型

一般的な Event です。

例

これらの例では、 HTMLMediaElement の loadeddata イベントにイベントリスナーを追加し、イベントが発生してイベントハンドラーが動作したときにメッセージを投稿します。

addEventListener() を使用する場合:

js

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 イベントハンドラープロパティを使用する場合:

js

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

仕様書

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

ブラウザーの互換性

BCD tables only load in the browser

関連イベント

関連情報