关于多个video
发布于 5 年前 作者 taoliang 417 次浏览 来自 问答

我在一个页面里面展现所有的视频,用户点击一个视频后直接播放,如果打开多个,希望将原先打开的视频自动暂停,请问该怎么弄,谢谢。

7 回复

多次点击后报这样的错误。

 this.data.oldvideoContext怎么获取的?怎么定义

wx.createVideoContext(id) ,这个中id需要我对页面上的每一个video自己定一个值把

wxml:

<video

id=’{{item.id}}’

controls=‘false’

src=’{{item.src}}’

bindplay=‘playVideoFn’>

</video>

js:

data:{

        oldvideoContext: ‘’

    }

playVideoFn: function(e) {

this.videoContext = wx.createVideoContext(e.currentTarget.id);

if (this.data.oldvideoContext && this.data.oldvideoContext.domId !== this.videoContext.domId){

this.data.oldvideoContext.pause();

}

this.setData({ oldvideoContext: this.videoContext})

}

我按照这种方式做,在开发者工具里可以每次只播放一个,但是暂停后,需要在播放,就不能直接用他的默认控制器了,但是在真机上,不能实现一次只允许播放一个,苹果和安卓的华为机都测了,不行。

js:

playVideo: function (e){

    var that = this;

    var VideoID = e.target.dataset.id

    var videoContext

    if (that.data.oldVideoID == ‘’){

      that.setData({

        oldVideoID: e.target.dataset.id

      })

    }

    if (VideoID != that.data.oldVideoID && that.data.oldVideoID!=’’) {

      videoContext = wx.createVideoContext(that.data.oldVideoID)

      videoContext.pause()

      console.log(‘videoContext.domId’, videoContext)

      that.setData({

        oldVideoID: VideoID

      })

    }

  },

wxml:

 <video id=“Video1” data-id=“Video1” bindtap=“playVideo” src=“http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400”    controls></video>

  <video id=“Video2” data-id=“Video2” bindtap=“playVideo” src=“http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400”    controls></video>

  <video id=“Video3” data-id=“Video3” bindtap=“playVideo” src=“http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400”   controls></video>

定义为空,

赋值:   this.data.oldvideoContext = videoContext

  var videoContext = wx.createVideoContext(id) 

 

    if (this.data.oldvideoContext && this.data.oldvideoContext.domId != videoContext.domId) {

 

      this.data.oldvideoContext.pause()

    }

    this.data.oldvideoContext = videoContext

大意就是对每个视频做一个 videoContext ,新的视频开始前,将老的视频 pause.

回到顶部