使用 JavaScript 在视频结束前几秒运行函数

Question

我有一个正在播放的视频。如何在视频结束前 5 秒调用函数？

我想在启动视频时放置一个计时器，问题是用户可以控制视频，停止它并重新播放他想要的次数，所以计时器变得无效。

例子会非常好！

-----编辑----- 这是我正在使用的代码的示例：

video = document.createElement("video");
    video.setAttribute("id", id);
    video.src = url;
    video.onended = function(e) {
        var playlistName = getPlaylistName();
        findNextSongToPlay(playlistName, playNextSong);
    };

我希望“onending”事件不是在最后调用，而是在 5 秒之前调用..所以我需要稍微改变一下..

再次，非常感谢！

Answer 1

这是给您的演示

编辑：更新了演示。

window.onload=function(){
video = document.createElement("video");
    video.setAttribute("id", "Myvideo");
    video.setAttribute("controls", "controls");
    video.src = "http://www.w3schools.com/html/mov_bbb.mp4"; 
    video.addEventListener("timeupdate", myfunc,false);
    document.body.appendChild(video);  
}

function myfunc(){
	if(this.currentTime > this.duration-5){
		//Less than 5 seconds to go. Do something here.

//---- For Demo display purposes
document.getElementById('Example').innerHTML="Less than 5 seconds to go!";
//---------
	} //End Of If condition.
//---- For Demo display purposes
else{document.getElementById('Example').innerHTML="";}
//---------
}

<div id="Example"></div>

由于您的播放器是动态创建的，您可以使用：

video = document.createElement("video");
video.setAttribute("id", id);
video.src = url;
  //Add the event Listener
  video.addEventListener("timeupdate", myfunc,false);
  video.onended = function(e) {
    var playlistName = getPlaylistName();
    findNextSongToPlay(playlistName, playNextSong);
  };

那应该调用这个函数

function myfunc(){
    if(this.currentTime > this.duration-5){
        //Do something here..
    }
}

如果您有任何疑问，请在下面发表评论，我会尽快回复您。

我希望这有帮助。快乐编码！