Javascript事件监听器在特定时间启动视频并在一定时间后停止视频

Question

我试图让我的视频(本地托管,而不是流式传输)在一段时间后启动并在一段时间后停止.这里有人用Javascript帮助我,但它对我不起作用 - 根本不影响播放时间.

所以,在我的标题中,我已经调用了这样的javascript:

<script src="Backend/build/Timer.js"></script>

实际的javascript看起来像这样:

// JavaScript Document

var starttime = 2000;  // start at 2 seconds
var endtime = 4000;    // stop at 4 seconds

var video = document.getElementById('player1');
video.currentTime = starttime;

video.addEventListener("timeupdate", function() {
    if (video.currentTime >= endtime) {
        video.pause();
    }
}, false);

Answer 1

1. 将代码包装到函数中并在document ready或body load事件处理程序中调用该函数,否则video变量值可能无效.

2. 根据W3C标准:

   currentTime获取时,该属性必须返回当前播放位置,以秒为单位表示.在设置时,如果媒体元素具有当前媒体控制器,则它必须抛出INVALID_STATE_ERR异常; 否则,用户代理必须寻找新值(这可能引发异常).

   如果你想开始播放影片在2秒,停在4秒(在视频时间标记),设置starttime,endtime分别为2,4,不是2000,4000.此外,求之前starttime,必须一次加载视频资源

   function playVideo() {
       var starttime = 2;  // start at 2 seconds
       var endtime = 4;    // stop at 4 seconds
   
       var video = document.getElementById('player1');
   
       //handler should be bound first
       video.addEventListener("timeupdate", function() {
          if (this.currentTime >= endtime) {
               this.pause();
           }
       }, false);
   
       //suppose that video src has been already set properly
       video.load();
       video.play();    //must call this otherwise can't seek on some browsers, e.g. Firefox 4
       try {
           video.currentTime = starttime;
       } catch (ex) {
           //handle exceptions here
       }
   }