在视频中暂停Javascript循环

Question

鉴于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++; 
} 

Answer 1

循环将无法满足您的需求，最好是倾听事件。

了与媒体-元件连接的所有事件的列表可以在W3C Page

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

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);