[英]Video event listener waiting for 'ended' not firing
在我的主页上,我有以下视频标签:
<video id="player" autoplay="" controls="" loop="" muted="" preload="auto"
style="background:black;max-height:420px;" src="/videos/f_latest.mp4" type="video/mp4">
</video>
然后在页面底部,我在<body>
末尾之前的<script>
包含此JavaScript:
var player = document.getElementById('player');
var firstVideo = Math.round(Math.random()); // Returns 0 or 1 to choose which
// video to display first
if (firstVideo) player.setAttribute("src", "/videos/t_latest.mp4");
player.addEventListener('ended',onVideoEnd,false); // The offending event listener
function onVideoEnd(e) {
if (player.getAttribute("src") == "/videos/f_latest.mp4")
player.setAttribute("src", "/videos/t_latest.mp4");
else player.setAttribute("src", "/videos/f_latest.mp4");
}
我遇到的问题是,虽然我的浏览器控制台中的onVideoEnd('ended')
运行完全正常,并且行为符合我的期望,但我无法启动事件侦听器。
奇怪的是,我可以得到几乎相同的代码来在不同的页面上工作:
<video src="" autoplay id="player" onclick="document.getElementById('pause').click()">
</video>
然后在<script>
下面:
var player = document.getElementById('player');
player.addEventListener('ended',onVideoEnd,false);
function onVideoEnd(e) {
get(0);
}
function get(direction) {
// Snipped
}
// More unrelated functions snipped
get(0);
我在Chrome控制台中注意到,LastPass可能会干扰我的脚本,因为它指出Error in event handler for (unknown): TypeError: Cannot read property 'windowID' of null
尽管Chrome突出显示了<!DOCTYPE html>
并在Chrome和Windows中禁用了LastPass,但Error in event handler for (unknown): TypeError: Cannot read property 'windowID' of null
Firefox无法解决此问题。 但是,我想澄清一下,否则控制台不会打印出任何错误。
朝正确方向的任何帮助或步骤将不胜感激!
您在第一个视频上具有loop
属性。 这意味着从技术上讲它永远不会结束,只会从头开始继续播放。
删除此属性以启用事件侦听器。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.