当灯箱关闭时暂停视频 - Javascript

时间:2016-12-07 22:46:09

标签: javascript html5-video

我们的网页上有多个videos,大多数视频都显示在light box,当我们正在观看video并决定关闭它时我们已经当用户关闭灯箱时会触发javascript事件,我们尝试实现的是当用户点击关闭时我们要循环播放所有videos页面并暂停当前播放的给定页面,原因是因为即使light box已关闭,视频仍会继续播放。

这是我到目前为止所做的:

  window.addEventListener("click", function(e) {
  if (e.target.className.indexOf("close") != -1) {

      var video = document.getElementsByTagName("video");

      for (var i = 0; i < video.length; i++) {
          video[i].addEventListener('timeupdate', function(event) {
              var vid = event.target
              console.log("here")
              vid.pause();
          })
      }

      console.log("close video background");
  }

});

现在这个脚本的问题是当我们第一次点击关闭它将Event Listener连接到给定的视频然后暂停它们时。问题是如果我重新打开视频并点击播放它会立即暂停,因为Event Listener有人可以解释我如何正确暂停视频

1 个答案:

答案 0 :(得分:0)

找到解决方案:

 var video = document.getElementsByTagName("video");

  for(var i = 0; i < video.length; i++){
   (function(vid) {
      vid.currentTime = 0;
      vid.pause();
  })(video[i]);
  }