このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

HTMLMediaElement: durationchange イベント

durationchange イベントは、duration 属性が更新されたときに発生します。

バブリング なし
キャンセル 不可
インターフェイス Event
対象 要素
既定のアクション なし
イベントハンドラプロパティ GlobalEventHandlers.ondurationchange (en-US)
仕様 HTML5 メディア

例

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

AddEventListener() を使用する場合

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

video.addEventListener('durationchange', (event) => {
  console.log('理由はわかりませんが、動画の再生時間が変わりました。');
});

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

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

video.ondurationchange = (event) => {
  console.log('理由はわかりませんが、動画の再生時間が変わりました。');
};

仕様

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

ブラウザーの互換性

BCD tables only load in the browser

関連情報