javascript - IE9 HTML5 视频 "play"事件在第二次播放时未触发

Question

我已经构建了简单的 HTML5 视频播放器。我遇到了 IE9 中“播放”事件未触发的问题。看看Fiddle .

播放器有一个大播放按钮，在播放前可见，播放时隐藏，视频结束时可见。

下面是我正在使用的三个监听器。

btn.addEventListener("click", function() {
    vid.play();
});

vid.addEventListener("play", function() {
    btn.style.display = "none";
    alert("'play' event fired");
});

vid.addEventListener("ended", function() {
    btn.style.display = "block";
});

在 IE9 中，视频第二次及后续播放时不会触发“播放”事件。

我猜这要么是我不理解“播放”HTML5 视频事件，要么是 IE9 中的某种错误。

非常感谢任何帮助。

Answer 1

一个假设::我认为paused即使视频结束，事件仍保持 false，因此可以尝试在视频结束后显式设置 pause，如下所示:

btn.addEventListener("click", function() {
    vid.play();
});

vid.addEventListener("play", function() {
    btn.style.display = "none";
    alert("'play' event fired");
});

vid.addEventListener("ended", function() {
    if( !this.paused ) this.pause();
    btn.style.display = "block";
});