jQuery检测可见但隐藏的元素

这似乎应该相当容易 – 但我找不到合适的选择器

根据文档（ http://api.jquery.com/hidden-selector/和http://api.jquery.com/visible-selector/ ）…

可以将元素视为隐藏，原因如下：

隐藏了一个祖先元素，因此该元素不会显示在页面上。

我想要检测的是“这个元素是可见的，但是包含在隐藏的父元素中”。即，如果我使父母可见，这个元素也将是可见的。

如果这是你经常使用的东西，那就做个自己的选择器:)这是一个例子：

jQuery.expr[':'].hiddenByParent = function(a) { return jQuery(a).is(':hidden') && jQuery(a).css('display') != 'none'; };

您可以像这样使用它，测试标记：

   Test

使用示例：

 $("div:hiddenByParent").length; // "2" (plain div + child match) $("#child").is(":hiddenByParent"); // true

或者，您可以使用.filter()函数，如下所示：

 $('selector').filter(function() { return $(this).is(':hidden') && $(this).css('display') != 'none'; }

jQuery现在都有这个内置function

 $("#child").closest(':hidden').length == 0

如果它是您正在寻找的特定元素，那么您可以检查它的显示属性

 $('#element').css('display') != 'none';

如果它不是特定元素，那么您可以使用以下方法找到隐藏的父节点：hidden然后使用自定义函数来查找所需类型的节点。例如

 $('parent-selector:hidden').find('node-selector').each(function(){ if($(this).css('display') != 'none') { // do what you wanted } });

如果你想要一个干净的选择器，那么我认为你会失去运气，因为我不认为你想要的是CSS规范的一部分，所以不会作为jQuery中的选择器。

我不认为只有一个选择器可以工作，但是

应该归还你需要的东西。如果你需要检查它的祖先而不仅仅是它的父级，你可以用一个可以递归’祖先链’的函数替换$(id).parent().is(':hidden')部分。