HTMLMediaElement: loadeddata イベント

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

バブリング なし
キャンセル 不可
インターフェイス Event
対象 Element
既定のアクション なし
イベントハンドラープロパティ GlobalEventHandlers.onloadeddata
仕様書 HTML5 media

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

例

これらの例では、 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.');
};

仕様書

仕様書 状態
HTML Living Standard
loadeddata media event の定義		 現行の標準
HTML5
loadeddata media event の定義		 勧告

ブラウザーの互換性

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
loadeddata eventChrome 完全対応 3Edge 完全対応 ありFirefox 完全対応 3.5IE 完全対応 9Opera 完全対応 10.5Safari 完全対応 3.1WebView Android 完全対応 ありChrome Android 完全対応 18Firefox Android 完全対応 4Opera Android 完全対応 ありSafari iOS 完全対応 ありSamsung Internet Android 完全対応 あり

凡例

完全対応  
完全対応

関連情報

関連トピック