使用javascript在一个视频标签中连续不断地获取视频源

时间:2014-09-25 07:23:15

标签: javascript jquery html5

我是JavaScript的新手,JQuery请求帮助我如何播放视频     当我点击一个按钮时,在视频播放器中持续不断。如何编写逻辑来获取     播放列表的录像带不断。     提前谢谢。

SourceCode:

start.html
<div class="videoplayer"  id="mainvideoplayer">
<div><input type="button" name="play" id="playAll" value="Play"/></div>
</div>

test.js
$(document).ready(function(){
var data = {
           "playlist": [
                         {
                        "videoName": "Video1",
                        "videoUrl": "videos/alu_blech_en.mp4"
                         },
                         {
                        "videoName": "Video2",
                        "videoUrl": "videos/wm30.mp4"
                         },
                         {
                        "videoName": "Video3",
                        "videoUrl": "videos/sample1.mp4"
                         },
                      ]
           };
    var video = $("<video class='item_video'  id='player' autoplay controls >");
    $("#mainvideoplayer").append(video);
    for (var i in data.playlist) {
                  var ele = $("<input type='checkbox' class='links'
                             id= \"" +data.playlist[i].videoName+ "\"
                            value=\""+data.playlist[i].videoUrl+"\">"
                            +data.playlist[i].videoName+"<br />");
                            $(".playlist-detail").append(ele);    
                                 }
    $("#playAll").click(function(event){
     $("#player").attr("src",play[0].link);
      });

   });

1 个答案:

答案 0 :(得分:2)

做这样的事......简单的方法

    $("#playAll").click(function(event){
   var getvideo = document.getElementById('player');
    var videosource = new Array();
    for(i=0;i<data.playlist.length;i++){
    videosource[i] = data.playlist[i].videoUrl;

   }
    getvideo.setAttribute('src', videosource[0]);
    getvideo.play();

    getvideo.addEventListener('ended', myHandler, false);
    function myHandler() {
        i++;
        getvideo.setAttribute('src', videosource[i]);
        getvideo.play();

    }
})