腾讯云点播开发引入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>

转载于:https://www.cnblogs.com/sgqwjr/p/11303094.html

Logo
魔乐社区

魔乐社区（Modelers.cn) 是一个中立、公益的人工智能社区，提供人工智能工具、模型、数据的托管、展示与应用协同服务，为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作，由全产业链共同建设、共同运营、共同享有，推动国产AI生态繁荣发展。

更多推荐

OpenLayers大数据可视化终极指南：10个性能优化技巧提升交互体验

OpenLayers作为一款功能强大的开源地图库，在处理大规模地理数据可视化时，性能优化是提升用户体验的关键。本文将分享10个实用的性能优化技巧，帮助开发者在使用OpenLayers构建大数据地图应用时，实现流畅的交互体验和高效的数据渲染。## 1. 合理使用WebGL渲染器提升大数据渲染速度 🚀WebGL渲染器是处理大规模地理数据的理想选择，它利用GPU加速图形渲染，能够显著提升数据量

avatar 魔乐社区

终极指南：如何用ffmpeg-python实现惊艳的视频合成效果

ffmpeg-python是一个强大的Python绑定库，为FFmpeg提供了简洁易用的接口，特别擅长处理复杂的视频过滤和合成任务。无论是简单的视频翻转还是复杂的多轨道合成，ffmpeg-python都能让你轻松实现专业级的视频效果。## 为什么选择ffmpeg-python进行视频合成？FFmpeg是视频处理领域的瑞士军刀，但命令行接口复杂且难以维护。ffmpeg-python将这种复杂

avatar 魔乐社区

揭秘CSDN博客之星TOP1攻略：从质量分查询到高分写作全解析

本文深度解析了在CSDN平台提升文章质量分、冲击“博客之星”评选的实战攻略。核心在于理解并优化CSDN文章质量分，通过详解目录结构设计、有效字数把控、代码规范、外链与图片使用技巧以及标签精准设置等方法，系统性地指导技术博主稳定产出高分内容，从而提升流量与评选竞争力。

avatar 魔乐社区