jQuery如何不断检查元素是否隐藏/可见？

Question

我网站上有几个HTML5视频（在滑块内），它们每隔x秒自动循环（或者当用户点击“下一张幻灯片”时）。我想停止那些实际上对用户不可见的视频，你有什么好的主意吗？我试图做类似于这样的事情，但我想这里缺少了"each"，而且它只有在点击后才能工作（好吧，实际上它并不能工作，因为我想这里使用了错误的"this"，但你懂我的意思，抱歉，我完全不懂JS :()：

document.on('click', ".videojs:hidden", function(){
   alert('video hidden!');    
   jQuery(this).player.pause();
});

- Wordpressor

---

你只有一个视频还是多个？ - Dion

@DRP96，我有无限数量的它们，从5个到“很多” :) - Wordpressor

Answer 1

您可能想要了解这个：

http://www.west-wind.com/weblog/posts/2008/Sep/12/jQuery-CSS-Property-Monitoring-Plugin-updated

然后您可以像这样做：

jQuery(".videojs").watch("display,visibility", function() { 
  if(!jQuery(".videojs").is(':visible'))
  {
    alert('video hidden!');    
    jQuery(".videojs").player.pause();
  }
});

- bardiir

Answer 2

我认为你想要研究使用setInterval()。类似这样：

var videoInterval = setInterval(function() {
  // video check logic here
}, 1000);

以上代码将每秒运行您的视频检查（1000毫秒）。您可能还可以使用 $（而不是 jQuery（。如果您需要停止任何原因的检查“循环”，则 videoInterval 变量将让您使用 clearInterval（）。我相信这段代码需要放在您的 $（document）.ready（function（）{...}）块内。

- super_seabass

---

我不能这样做，循环时间可以更改。当用户决定手动循环时会发生什么？ - Wordpressor

您可以清除间隔并设置新的间隔以更改计时器。当用户手动循环时，您也可以清除间隔并重新启动它。另一种选择是钩入您的循环逻辑（如果您正在使用插件，则大多数提供回调函数，在插件循环时调用），然后关闭隐藏的电影。 - super_seabass