代码示例:
var vList = ['视频地址url1', 'url2', '...']// 初始化播放列表
var vLen = vList.length// 播放列表的长度
var curr = 0// 当前播放的视频
var video = new Video()
video.addEventListener('end', play)
play()
function play(e) {
video.src = vList[curr]
video.load()// 如果短的话,可以加载完成之后再播放,监听 canplaythrough 事件即可
video.play()
curr++
if (curr >= vLen) curr = 0// 播放完了,重新播放
}
如此即可可以实现html5 播放多个视频连续播放
连续播放两个视频是什么意思?
如果是同时播放两个,写两个 <video></video>标签就行了,一个标签放一个视频;
如果是播放完一个视频后接着再播放下一个视频这样连续播放,用脚本监听 <video>标签的视频播放结束 事件,再接着播放下一个视频就行;
<video id="video" src="test1.mp4"></video> <script>var video = document.getElementById('video')
video.addEventListener('ended',function(){
// 第一个视频播放结束
// 如果要继续播放第二个视频,改变 <video> 标签的 (src="test2.mp4") 属性或者新建一个 video 标签播放视频都可以
},false)
</script>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)