canplay イベントは、ユーザーエージェントがメディアを再生できるようになったものの、追加のバッファリングのために停止することなくメディアの最後まで再生するには充分なデータが読み込まれていないとみられる場合に発生します。

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

構文

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

addEventListener("canplay", (event) => {});oncanplay = (event) => {};

イベント型

一般のEvent です。

例

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

addEventListener() を使用した例:

const video = document.querySelector("video");video.addEventListener("canplay", (event) => {  console.log(    "動画は開始できますが、最後まで再生されるかどうかはわかりません。",  );});

イベントハンドラープロパティoncanplay を使用した例:

const video = document.querySelector("video");video.oncanplay = (event) => {  console.log(    "動画は開始できますが、最後まで再生されるかどうかはわかりません。",  );};

仕様書

ブラウザーの互換性

関連イベント

• HTMLMediaElementplaying イベント
• HTMLMediaElementwaiting イベント
• HTMLMediaElementseeking イベント
• HTMLMediaElementseeked イベント
• HTMLMediaElementended イベント
• HTMLMediaElementloadedmetadata イベント
• HTMLMediaElementloadeddata イベント
• HTMLMediaElementcanplaythrough イベント
• HTMLMediaElementdurationchange イベント
• HTMLMediaElementtimeupdate イベント
• HTMLMediaElementplay イベント
• HTMLMediaElementpause イベント
• HTMLMediaElementratechange イベント
• HTMLMediaElementvolumechange イベント
• HTMLMediaElementsuspend イベント
• HTMLMediaElementemptied イベント
• HTMLMediaElementstalled イベント

関連情報

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