Javascript - 自动视频播放列表

Question

我想知道如何在没有任何按钮或控件的情况下实现视频播放列表，只需播放一组视频并在最后一次结束时再次开始。

我发现这段关于可点击播放列表的代码片段：http://jsfiddle.net/e8CbF/ 但我真的不知道如何使它自动化。此外，该数组来自一个PHP变量，我该如何在代码中使用它？

function loadVids(vidsArray){ 
for(var a=0,b,f=document.createDocumentFragment();b=vidsArray[a];++a){ 
    var c=document.createElement('div'); 
    c.textContent=b; 
    f.appendChild(c); 
} 
d.appendChild(f); 
} 
var video=document.createElement('video'),vids=['http://screen.digitalifts.com/screenfiles/video1.mp4','http://screen.digitalifts.com/screenfiles/video2.mp4'], /* Is it there that I should put the php array ? */ 
d=document.createElement('div'); 
d.onclick=function(e){if(e.target.parentNode==this){ 
video.src=e.target.textContent; 
video.play(); 
}} 
document.body.appendChild(video); 
document.body.appendChild(d); 
loadVids(vids); 

Answer 1

你的代码是一团糟。所以我完全重写它。

<video src="" id="player"/> 

<script> 
var video=counter=0; 

videos=['<?php echo join("';'",$array);?>']; 

window.onload=()=>{ 
    //get the video frame 
    video=document.getElementById("player"); 
    //if the video ended, play next. 
    video.addEventListener("ended",play,false); 
    //start 
    play(); 
} 

var play=()=>{ 
    //add the video src 
    video.src=videos[counter]; 
    //play next video next time 
    counter++; 
    if(counter==videos.length){ 
     counter=0; 
    } 
}; 
</script>