如何在 html5 視頻開始播放時運行函數

Question

我正在用 ionic 構建一個應用程序，我想在視頻開始播放時運行一個函數，例如隱藏按鈕等。這是我的代碼

    let video = <HTMLVideoElement> document.getElementById(i)
    if(video.paused) {
        video.play()
        video.oncanplay=()=>console.log('Starts playing');
    }

代碼不起作用，請問我如何在該頁面上的任何視頻開始播放時運行函數

Answer 1

var vid = document.getElementById("myVideo");
vid.onplay = function() {
    alert("The video has started to play");
};

從這里： https : //www.w3schools.com/tags/av_event_play.asp

Answer 2

試試這個， play返回一個 promise。

const video = document.getElementById("myVideo");

async function playVideo() {
  try {
    await video.play();
    // video is playing, do your stuff here
  } catch(err) {
    // video is not playing
  }
}

if(video.paused) {
    playVideo()
 }

更多信息： https : //developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/play