1. 程式人生 > >html5 JS 迴圈播放多個視訊源

html5 JS 迴圈播放多個視訊源

 ...
 var video_list    = [url1,url2];
                                    var video_index    = 0;
                                    var video_player   = null;

                                    var onVideoEnded = function(){
                                        console.log("video ended");
                                        if(video_index < video_list.length - 1){
                                            video_index++;
                                        }
                                        else{
                                            video_index = 0;
                                        }
                                        console.log("playing:"+ video_list[video_index]);
                                        video_player.setAttribute("src", video_list[video_index]);
                                        video_player.play();
                                    }
                                    
                                    var onload = function(){
                                        console.log("body loaded");
                                        video_player = $("video")[0];
                                        video_player.setAttribute("src", video_list[video_index]);
                                        video_player.addEventListener('ended',onVideoEnded);
                                        video_player.play();
                                    };

                                    
                                   onload();
...