html页面多个视频标签时设定只能播放一个视频
html页面经常会出现存在多个视频的情况,点击单个视频时,该视频播放,点击另外一个视频时,需要让正在播放的视频停止,开始播放所点击的新视频。如果不单独设置,就会出现页面同时播放多个视频的情况。
设置代码如下:
var videos = document.getElementsByTagName('video');
for (var i = videos.length - 1; i >= 0; i--) {
(function(){
var p = i;
videos[p].addEventListener('play',function(){
pauseAll(p);
})
})()
}
function pauseAll(index){
for (var j = videos.length - 1; j >= 0; j--) {
if (j!=index) videos[j].pause();
}
}