javascript - html5 视频上的 Firefox onclick 事件

Question

在 Mozilla Firefox 中，点击 html5 视频会默认暂停/播放，但在 Chrome 或 Safari 中则不会。我想在 FF 中禁用此行为。但似乎 FF 阻止了视频上的某些事件冒泡，我无法点击。

window.addEventListener("click", function(e){
    if (e.target && e.target.matches('.html5video')) { 
        console.log('click');
    }       
});

这段代码在 FF 中什么都不做。

有什么解决这个问题的建议吗？我如何跟踪 FF 中 html5 视频标签的点击事件？

我应该使用某种包装器还是...？

Answer 1

在 FF 的最新版本 (64) 中，如果您删除视频元素的 controls 属性，您的代码就可以正常工作。

如果您不能删除控件，您可以监听，例如，暂停事件。暂停后重新开始播放....

document.querySelector('.html5video').addEventListener('pause', function(e) {
   // don't pause....
   this.play();
})

<video class="html5video" width="400" controls>
    <source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
    <source src="https://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg">
    Your browser does not support HTML5 video.
</video>