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

Question

我的网站上有一些HTML5视频（在滑块内），它们每隔x秒自动循环一次（或者当用户点击“下一张幻灯片”时）。

我想停止用户实际看不到的视频，任何想法如何实现？

我尝试做类似的事情，但我猜有“每个”都缺失了，而且它总是在点击之后一直工作（好吧，实际上它不起作用因为“这个”在这里使用错了我猜，但是你得到了关键，对不起，我根本不是一个JS人:(）：

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

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();
  }
});

Answer 2

我想你想研究一下使用setInterval（） 。 就像是：

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

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