Suk*_*uka 4 html javascript firefox html5-video
HTML 视频元素上的 Javascript onclick 不起作用。
编辑：在 Firefox（66.0.5（64 位））中不起作用。在 Chrome (74.0.3729.131) 中有效。
控制台中没有错误。
当视频点击/开始时（视频长度需要等待），我将在 div 框中放置文本。
function myfunction () {
console.log("onclick");
document.getElementById("videotextbox").innerHTML = "VIDEO-INFO";
}<div>
<video onclick="myfunction()" id="videoid" width="600" controls>
<source src="myvideo.mp4" type="video/mp4">
Your browser does not support HTML5 video.
</video>
</div>
<div id="videotextbox"></div>w3schools 写道：
支持的 HTML 标签：所有 HTML 元素，除了：<base>、<bdo>、<br>、<head>、<html>、<iframe>、<meta>、<param>、<script>、<style>、和<标题>
请一个没有jquery或ajax的解决方案。
这是因为controls. 当用户单击 MediaElements 的控件时，浏览器不会公开。
您可以尝试单击 Chrome 中的播放按钮或时间线，您会看到单击事件实际上已停止。
在 Firefox 中，这些控件覆盖了整个视频元素，因此，您的元素上不会有任何点击事件。 （从技术上讲，Chrome 也是如此，我怀疑这是他们在更新播放器时留下的错误）。
因此，如果您确实需要点击事件，则不要设置该controls属性：
document.querySelector('video').onclick = e =>
console.log('clicked');<video src="https://upload.wikimedia.org/wikipedia/commons/transcoded/a/a4/BBH_gravitational_lensing_of_gw150914.webm/BBH_gravitational_lensing_of_gw150914.webm.480p.webm" autoplay></video>但一般情况下，您不需要监听点击事件，而是需要监听、等媒体事件。playingpauseseek
const vid = document.querySelector('video');
['playing', 'pause', 'seeked', 'ended'].forEach(t =>
vid.addEventListener(t, e => console.log(t))
);video{
max-height: 100vh;
margin-bottom: 100px;
}<video src="https://upload.wikimedia.org/wikipedia/commons/transcoded/a/a4/BBH_gravitational_lensing_of_gw150914.webm/BBH_gravitational_lensing_of_gw150914.webm.480p.webm" controls></video>| 归档时间： |
|
| 查看次数： |
1782 次 |
| 最近记录： |