腾讯云点播开发引入mui.js 导致播放控件点击事件多次触发

腾讯云点播开发引入mui.js 导致播放控件点击事件多次触发

<video id="player-container-id" preload="auto" width="640" height="360" x5-video-player-type="h5" x5-video-player-fullscreen="true" x5-video-orientation="landscape" playsinline webkit-playsinline></video>

当腾讯云点播 video 标签写上x5-video-player-type="h5"属性时,会使用X5 UI 的播放器,可以解决播放器被劫持不显示配置的控件,

当此时引入的mui.js进行开发时,就会发现控件每次点击会执行两次,导致播放按钮点击无法播放或暂停,倍速按钮点击后,倍速会跳过一次。

解决办法是:

给video加一个父级元素(没有的话)

然后阻止父级元素touchsart的冒泡

document.querySelector(".win").addEventListener('touchstart', function(event) {event.stopPropagation()}) 

<div class="win">

  video...

</div>

posted @ 2019-08-05 15:08  云行月翔  阅读(294)  评论(0编辑  收藏  举报