HTMLMediaElement: ended 事件

Baseline 已廣泛支援

此特性已相當成熟,可在許多裝置和瀏覽器版本上使用。自 ⁨2015 年 7 月⁩以來,各瀏覽器均已提供此特性。

當播放或流媒體因媒體末尾或沒有更多可用資料而停止時,會觸發 ended 事件。

此事件由 HTMLMediaElement<audio><video>)觸發,當播放到達媒體末尾時會觸發 ended 事件。

此事件不可取消,也不會冒泡。

注意: 如果 loop 屬性為 trueplaybackRate 為非負值,則 ended 事件不會觸發。

語法

在諸如 addEventListener() 之類的方法中使用事件名稱,或設定事件處理程式屬性。

js
addEventListener("ended", (event) => { })

onended = (event) => { }

事件型別

一個通用的 Event

示例

這些示例為 HTMLMediaElement 的 ended 事件添加了一個事件監聽器,然後在該事件處理程式響應事件觸發後傳送一條訊息。

使用 addEventListener()

js
const video = document.querySelector("video");

video.addEventListener("ended", (event) => {
  console.log(
    "Video stopped either because it has finished playing or no further data is available.",
  );
});

使用 onended 事件處理程式屬性

js
const video = document.querySelector("video");

video.onended = (event) => {
  console.log(
    "Video stopped either because it has finished playing or no further data is available.",
  );
};

規範

規範
HTML
# event-media-ended
HTML
# handler-onended

瀏覽器相容性

另見