4

播放 html5 视频。完成后，将调用下面的脚本，该脚本将添加到下一个视频，并将其添加到下一行并开始播放。如何将其变成一个循环，以便第二个视频播放完毕后，它将附加第三个视频，依此类推？

<div>
    <video id="video0" autoplay>
        <source src="video0.mp4" />
    </video>
</div>

.

var i=0
$('video'+i).on("ended", function() {
    i++;
    $(this).parent().append('<br /><video id="video'
        + i
        + '" autoplay><source src="video'
        + i
        + '.mp4" /></video>');
    };
4

4 回答 4

2

更新答案：

在重新阅读您的问题并查看更改后，这里有一些逻辑应该可以满足您的要求......

var i = 0;
var numVideos = 5;
var addVideo = function() {
    i++;
    var nextVideo=$('<video id="video'
        + i
        + '" autoplay><source src="video'
        + i
        + '.mp4" /></video>');
    nextVideo.on('ended', addVideo);
    $(this).after('<br />').after(nextVideo);
};
$('video0').on('ended', addVideo);

原答案：

如何将loop属性添加到您的video标签？ W3 资源

于 2012-06-04T19:24:43.837 回答
1

试试用它对你有帮助吗？

在头部标签中： 

 <script type="text/javascript" language="javascript"> 
            video_count = 1; 
            function run() { 
                video_count++; 
                var videoPlayer = document.getElementById("homevideo"); 
                if (video_count == 4) 
                    video_count = 1; 
                var nextVideo = "ModelVideo/1/video" + video_count + ".mp4"; 
                videoPlayer.src = nextVideo; 
                videoPlayer.load(); 
                videoPlayer.play();        
            }; 
        </script>

在正文标签中：

    <div style="width: 30%;"> 
            <video id="homevideo" width="100%" controls autoplay onended="run()"> 
            <source id="ss" src="ModelVideo/1/video1.mp4" type='video/mp4'/></video> 
        </div>
于 2014-01-27T14:20:51.373 回答
1

HTML 5 视频可以使用 'loop' 属性循环播放：

loop="loop"

可以通过以下方式支持不支持循环的浏览器：

$("#video").bind('ended', function(){ 
  this.play();
});

参考

于 2012-06-04T19:25:18.170 回答
0

尝试用它来帮助你做 jQuery？

在头部标签中： 

    <script type="text/javascript">
            $(document).ready(function () {
                v_count = 1;
                $("#video").bind('ended', function () {
                    v_count++;
                    if (v_count == 4)
                        v_count = 1;
                    $("#sovideo").attr("src", "ModelVideo/1/video" + v_count + ".mp4");
                    $("#video").load();
                    this.play();                            
            });   
        </script>

在正文标签中： 

        <div style="width: 30%;"> 
            <video id="video" width="100%" controls>
            <source id="sovideo" src="ModelVideo/1/video1.mp4" />
        </div>
于 2014-01-27T17:54:02.400 回答