最近用到 video.js 来播放 HLS 视频,因为视频为监控画面,所以不需要单击暂停功能,以免用户误操作。
网上大多数解决办法都是通过CSS来屏蔽鼠标事件:
.vjs-tech { pointer-events: none; }
但是 video.js 从 7.1.0 开始,增加了一个很方便的功能:双击画面切换全屏。
如果用了上面的办法,双击全屏功能也失效了。我想保留这个功能。
后来找到两全其美的解决办法:
// player 为 video.js 实例 player.tech_.off('mouseup'); player.tech_.on('mouseup', function(e) { e.preventDefault(); });
感谢:https://github.com/videojs/video.js/issues/3250#issuecomment-481642162
更新:video.js 7.6 中,’mousedown’事件改为’mouseup’ (#5992) (075a504)
重要提示:如果遇到错误提示 tech_ 为 undefined,则将设置 src 改在上述代码之后,即初始化选项中不包含src,最后再执行 player.src({src: ‘*******’})