使用JQuery（如$。“。someClass”）确定元素集合是否可见

Question

我的页面上有一系列元素，我想知道它们当前是否可见。

所以：

$(".someClass")

我如何循环并弄清楚这一点？因为如果它是可见的，我必须发射另一个功能。

Answer 1

$(".someClass").each(function(){
  if($(this).is(":visible")){
    //item is visible: do something
   }
});

那怎么样？

Answer 2

$(".someClass:visible")

将返回可见的。

Answer 3

你能做什么：

$(".someClass").each(function(x) { if ( x.style.display != "none" && x.style.visibility != "hidden" ) { your_function(); } });

其中your_function()是您的函数名称。

Answer 4

$('.someClass').is(':visible')方面的所有解决方案都不可靠。它告诉我们的是，特定元素的样式是display:none还是visibility:hidden。这不与元素是否可见相同！

考虑这样的情况：

  

<div style="display:none;"><div class="someClass"></div></div>

每个人都可以看到$('.someClass')指定的元素是不可见的。但$('.someClass').is(':visible')将返回true！

唯一的防水解决方案不仅要检查is(':visible')上的$('.someClass')，还要查看其所有父元素。只有当父母的无持有is(':visible') === false时，我们才能得出结论$('.someClass')实际上是可见的。