**在安卓多视频页面无法实现单个视频播放,只能多个视频播放同时播放
比如我列表有2个视频,我播放第一个视频中,然后又去播放第二个,他会两个同时播放
我只想让他只能同时播放一个是不行的
苹果没问题,安卓会出现这个问题
**
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<title>Video Example</title>
</head>
<body style="margin:0;padding:0;text-align:center;">
视频播放控件
<div id="videoBox" style="">
</div>
</body>
<script type="text/javascript" src="../../js/mui.js"></script>
<script type="text/javascript" src="../../js/jquery-2.1.0.js"></script>
<script type="text/javascript">
var video=[]
var videoindex=0
// H5 plus事件处理
function plusReady(){
var videoSrc=['http://bz.yq80.cn/ywv_fa4a0201905211039395486.mp4?e=1589942495&token=sARKWczII9w_4y4Gi3VeY1Qym-nJlJrS2i5ObeQa:OHtdSUb9zk90euErJIs0TDexEbM=','http://bz.yq80.cn/ywv_fa4a0201905211039395486.mp4?e=1589942495&token=sARKWczII9w_4y4Gi3VeY1Qym-nJlJrS2i5ObeQa:OHtdSUb9zk90euErJIs0TDexEbM=','http://bz.yq80.cn/ywv_fa4a0201905211039395486.mp4?e=1589942495&token=sARKWczII9w_4y4Gi3VeY1Qym-nJlJrS2i5ObeQa:OHtdSUb9zk90euErJIs0TDexEbM=']
$.each(videoSrc,function(index,src){
var template=''
template+='<div id="video'+index+'" style="width:80%;height:200px;background-color:#000000;margin:auto;margin-bottom:20px;position:relative"></div>'
$("#videoBox").append(template)
video[index] = new plus.video.VideoPlayer('video'+index,{src:src,poster:"http://bz.yq80.cn/ywv_fa4a0201905211039395486.mp4?vframe/jpg/offset/5/w/300/h/300&e=1589942495&token=sARKWczII9w_4y4Gi3VeY1Qym-nJlJrS2i5ObeQa:NipIY9xULGSwIgifqJzXtv25IEU=",direction:0,});
})
// 监听开始播放事件
for(i=0;i<video.length;i++){
var k=i
video[i].addEventListener('play',function(e){
$.each(video,function(index,obj){
if(obj.id==e.target.id){
}else{
obj.pause()
}
})
}, false)
video[i].addEventListener('pause', function(e){
console.log('Video');
}, false)
// 监听播放进度更新事件播放秒数
video[i].addEventListener('timeupdate', function(e){
// if(e.target.id==videoindex){}else{
// videoindex=e.target.id
// }
}, false);
}
function onEvent(event) {
// Authenticate success code.
}
}
document.addEventListener('plusready', plusReady, false);
// 播放视频
function playVideo(a){
video[a].play()
}
//暂停播放
function stopVideoPlay(a){
video[a].pause()
}
</script>
</html>
1 个回复
ZGH0709
监听第二个视频的播放事件,在播放时判断如果有视频已经播放,将视频暂停即可。