289

我想检查和排序隐藏的元素。是否可以找到所有具有属性display和值的元素none

4

8 回答 8

636

您可以对可见元素使用:visible并使用:hidden找出隐藏元素。此隐藏元素的display属性设置为none

hiddenElements = $(':hidden');
visibleElements = $(':visible');

检查特定元素。

if($('#yourID:visible').length == 0)
{

}

如果元素占用了文档中的空间,则元素被认为是可见的。可见元素的宽度或高度大于零, 参考

您也可以将is():visible

if(!$('#yourID').is(':visible'))
{

}

如果要检查显示值,则可以使用css()

if($('#yourID').css('display') == 'none')
{

}

如果您使用显示以下值display可以有。

显示:无

显示:内联

显示:块

显示:列表项

显示:内联块

在此处display检查可能值的完整列表。

使用 JavaScript 检查显示属性

var isVisible = document.getElementById("yourID").style.display == "block";
var isHidden = document.getElementById("yourID").style.display == "none"; 
于 2013-04-10T11:37:23.363 回答
67
$("element").filter(function() { return $(this).css("display") == "none" });
于 2013-04-10T11:39:59.630 回答
30

是的,您可以使用 cssfunction。下面将搜索所有 div,但您可以根据需要修改它

$('div').each(function(){

    if ( $(this).css('display') == 'none')
    {
       //do something
    }
});
于 2013-04-10T11:43:44.313 回答
17

jQuery 中有两种方法来检查可见性:

$("#selector").is(":visible")

$("#selector").is(":hidden")

您还可以根据选择器中的可见性执行命令;

$("#selector:visible").hide()

或者

$("#selector:hidden").show()
于 2013-04-10T11:51:59.410 回答
13

使用这个条件:

if (jQuery(".profile-page-cont").css('display') == 'block'){
    // Condition 
}
于 2014-03-14T12:12:18.233 回答
11
$('#selector').is(':visible');
于 2013-04-10T11:38:27.113 回答
0

现场演示

<div id="div" style="display: none"></div>
<button class="try">Try now</button>

<script type="text/javascript">
$(document).on('click','.try',function() {
var style = $('#div');
if (style.css("display") == "none") {
  alert("display not available");
}
});
</script>
于 2021-05-17T16:40:24.387 回答
0

另一个我个人比.is() 或.length 更喜欢的捷径:

if($('.myclass:visible')[0]){
   // is visible
}else {
   // is hidden
}
于 2020-09-09T08:33:24.733 回答