HTMLMediaElement: timeupdate イベント

timeupdate イベントは、currentTime 属性で示される時刻が更新されたときに発生します。

イベントの頻度はシステムの負荷に依存しますが、およそ 4Hz と 66Hz との間でスローされます (イベントハンドラーが実行するのに 250 ms 以上かかることはないと仮定します)。ユーザーエージェントはシステム負荷とその都度イベントを処理する平均コストに基づいて、イベントの頻度を変えることが推奨されているため、ユーザーエージェントがビデオのデコード中に快適に処理できるよりも頻繁に UI 更新が行われることはありません。

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

例

これらの例は、 HTMLMediaElement の timeupdate イベントのイベントリスナーを追加し、イベントが発生してイベントハンドラーが動作するときにメッセージを投稿します。なお、イベントの頻度はシステムの稼働状況に依存します。

addEventListener() の使用:

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

video.addEventListener('timeupdate', (event) => {
  console.log('The currentTime attribute has been updated. Again.');
});

ontimeupdate イベントハンドラープロパティの使用:

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

video.ontimeupdate = (event) => {
  console.log('The currentTime attribute has been updated. Again.');
};

仕様書

ブラウザーの互換性

BCD tables only load in the browser

関連情報