HTMLMediaElement: canplaythrough イベント

canplaythrough イベントは、ユーザーエージェントがメディアを再生可能なときに発生し、コンテンツをさらにバッファリングするために再生を停止することなく、メディアを最後まで再生するのに十分なデータが読み込まれたと推定します。

このイベントはキャンセル不可で、バブリングしません。

構文

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

addEventListener("canplaythrough", (event) => {});
oncanplaythrough = (event) => {};

イベント型

一般の Event です。

例

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

addEventListener() を使用する場合:

const video = document.querySelector("video");
video.addEventListener("canplaythrough", (event) => {
 console.log(
 "バッファリングを止めることなく、動画全体を再生できると思います。",
 );
});

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

const video = document.querySelector("video");
video.oncanplaythrough = (event) => {
 console.log(
 "バッファリングを止めることなく、動画全体を再生できると思います。",
 );
};

仕様書

ブラウザーの互換性

関連イベント

• HTMLMediaElement playing イベント
• HTMLMediaElement waiting イベント
• HTMLMediaElement seeking イベント
• HTMLMediaElement seeked イベント
• HTMLMediaElement ended イベント
• HTMLMediaElement loadedmetadata イベント
• HTMLMediaElement loadeddata イベント
• HTMLMediaElement canplay イベント
• HTMLMediaElement canplaythrough イベント
• HTMLMediaElement durationchange イベント
• HTMLMediaElement timeupdate イベント
• HTMLMediaElement play イベント
• HTMLMediaElement pause イベント
• HTMLMediaElement ratechange イベント
• HTMLMediaElement volumechange イベント
• HTMLMediaElement suspend イベント
• HTMLMediaElement emptied イベント
• HTMLMediaElement stalled イベント

関連情報

• HTMLAudioElement
• HTMLVideoElement
• <audio>
• <video>