Jquery – 如何查看隐藏DIV中的子项是否可见？

我如何检查隐藏div中的div …如果可见或不可见？

HTML

JS

 if($('#two_child').is(':visible')) { alert('true'); } 

这不行。

任何想法？

提前致谢！ 彼得

Answer 1

你可以检查一下css的display属性：

 if ($("#two_child").css("display") != "none") { //... } 

正如Gaby在评论中指出的那样，如果使用visibility隐藏您的元素，这将无效，因此您可能希望将其扩展为：

 var $child = $("#two_child"); if ($child.css("display") != "none" && $child.css("visibility") != "hidden") { //... } 

Answer 2

我保存了这两个选择器扩展，这与Steve的版本基本相同：

从另一个SO回答 ：

 // jQuery selector to find if an element is hidden by its parent jQuery.expr[':'].hiddenByParent = function(a) { return $(a).is(':hidden') && $(a).css('display') != 'none' && $(a).css('visibility') == 'visible'; }; 

来自Remy Sharp和Paul Irish：

 // reallyvisible - by remy sharp & paul irish // :visible doesn't take in to account the parent's visiblity - 'reallyvisible' does...daft name, but does the job. // not neccessary in 1.3.2+ $.expr[ ":" ].reallyvisible = function(a){ return !(jQuery(a).is(':hidden') || jQuery(a).parents(':hidden').length); }; 

Answer 3

:visible选择器不能像这样工作

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

• 它们的CSS显示值为none。
• 它们是type =“hidden”的表单元素。
• 它们的宽度和高度显式设置为0。
• 隐藏了一个祖先元素，因此该元素不会显示在页面上。

如果要检查css属性，可以创建一个自定义css选择器，如“ 按CSS样式选择元素”中所示（所有具有给定样式）

Answer 4

使用filter检查display样式， jsFiddle上的示例

 $("div") .filter(function(){ return $(this).css("display") == "none"; }).find("> div").filter(function() { return $(this).css("display") != "none"; }).length 

参考

• jQuery .filter（）

Answer 5

因为隐藏元素的子元素将始终隐藏显示，您可以尝试

 $("#child_two").css("style") == "none" 

这只适用于使用css隐藏内容的情况。

Answer 6

只是返回false :-)一个盒子里的物品，你找不到……好吧……你可能用盒子丢了那个项目;-)