播放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>');
};
答案 0 :(得分: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 Resource
答案 1 :(得分:1)
HTML 5视频可以使用'loop'属性循环播放:
loop="loop"
可以通过以下方式支持没有循环支持的浏览器:
$("#video").bind('ended', function(){
this.play();
});
答案 2 :(得分: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>
在Body标签中
<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>
答案 3 :(得分: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>
在Body标签中
<div style="width: 30%;">
<video id="video" width="100%" controls>
<source id="sovideo" src="ModelVideo/1/video1.mp4" />
</div>