Question

我已经在HTML5视频中编写了这段代码，以便使用时间功能。如果我将这行代码设置为

if(vid.currentTime > 5){
        vid.pause();
     }

视频会自动暂停，这就是我想要的。但是，如果我将其设置为

if(vid.currentTime == 5){
        vid.pause();
     }

它拒绝暂停，我希望它在不同时间暂停，以便触发不同的动作。我不知道为什么。我已经研究并尝试谷歌类似的情况但没有运气。任何帮助将不胜感激。这是完整的代码：

window.onload = init;

let vid;

function init() {


    vid = document.querySelector("#myPlayer");

    vid.ontimeupdate = displayTimeWhileVideoIsPlaying;
}

function playVideo() {
    vid.play();
}

function pauseVideo() {
    vid.pause();
}

function rewindVideo() {
    vid.currentTime = 0
}

function displayTimeWhileVideoIsPlaying(evt) {
    console.log(vid.currentTime);
    ccc = 5;
    if(vid.currentTime > 5){
        vid.pause();
     }

}

这是我的codepen的工作演示链接： https://codepen.io/Okezie/pen/xWOLQd?editors=1011
问题可能在我的代码笔的第28行。

Answer 1

您可以跟踪哪些暂停点被击中，而不是再次暂停。

var points = [ 
    { time: 5 , done: false},
      { time: 6 , done: false},
    { time: 8 , done: false},
    { time: 9 , done: false},
];

function displayTimeWhileVideoIsPlaying(evt) {

for(var point of points){
  console.log(vid.currentTime);
  if(vid.currentTime > point.time){
      if(!point.done){
        vid.pause();
        //vid.currentTime = point.time; //Optional, if you want to pause exact
        point.done = true;
      }
   }
}

!point.done检查防止大于检查的'不精确'。如果代码先前在5处暂停，它可以防止暂停在5.3,5.4,5.8等处生效。

查看更新的笔：https://codepen.io/anon/pen/PRGOxW

如何在html5视频中停止视频之前检查当前时间是否等于特定数字

1 个答案: