javascript - 时间范围内的 HTML5 视频

Question

因此，我正在开发一个交互式 HTML5 视频播放器，目前使用 popcorn.js 时一切正常，但我现在尝试返回并让我的播放器在不依赖 popcorn.js 的情况下工作。

使用 popcorn.js 时，您可以使用如下代码:

popcorn.code((
    start: 0,
    end: 5,
    onStart: function( options ) {
        //put code here
    }
}}

当视频时间从 0 到 5 时，您的代码将被执行。现在，我试图在视频的特定时间范围内执行某些代码块，但我似乎无法得到它工作正常，只是想知道是否有人能看到我在哪里解决这个错误。

while (myVideo.currentTime >= 0 && myVideo.currentTime <= 5)
{
    console.log(myVideo.currentTime);
}

这个 while 循环运行得非常快，导致浏览器变慢并卡住。 但是，如果我尝试使用 if 循环而不是 while 循环，它(显然)只会检查一次。

Answer 1

您可以检查的数量少于 while 循环的数量。

var check = setInterval(function() {
    if (myVideo.currentTime >= 5) {
        clearInterval(check);
        console.log("5 seconds reached");
    }
}, 500);

当用户暂停并重新开始或跳到时间线内的另一个时间时，您可以再次开始此操作。