在视频期间暂停 javascript 循环

Pause Javascript Loop During Video

本文关键字：javascript 循环 暂停 视频      更新时间：2023-09-26

给定HTML5视频，是否可以创建一个for-或while-循环，直到其中的视频结束才会继续？ 例如，下面的代码应该按顺序播放三个视频，而不是同时播放。

<video id="video0">
    <source src="video0.mp4">
</video>
<video id="video1">
    <source src="video1.mp4">
</video>
<video id="video2">
    <source src="video2.mp4">
</video>

.

var i=0;
while (i<3) {
    document.getElementById('video'+i).play();
    i++;
}

循环在这里不能满足你的需求，最好侦听事件。

与媒体元素相关的所有事件的列表可以在W3C页面上找到

因此，在您的特定情况下，这样的事情应该可以帮助您：

var playVideo = function(videoID){
    var video = document.getElementById('video'+videoID);
    if(video){    
        video.play();
        //binding the eventHandler for the event firing at the end of the video
        video.onended = function(e){
            playVideo(videoID++);
        }
        /* 
        Another way of binding the event-listener:
        video.addEventListener('ended',function(){
            playVideo(videoID++);
        });
        */
    }
}
playVideo(0);
相关文章：