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 ⁨2015年7月⁩.

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

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

構文

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

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

イベント型

一般的なEvent です。

例

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

addEventListener() を使用する場合:

const video = document.querySelector("video");video.addEventListener("loadeddata", (event) => {  console.log(    "やった! readyState が初めて HAVE_CURRENT_DATA 以上になりました。",  );});

onloadeddata イベントハンドラープロパティを使用する場合:

const video = document.querySelector("video");video.onloadeddata = (event) => {  console.log(    "やった! readyState が初めて HAVE_CURRENT_DATA 以上になりました。",  );};