使用jQuery检查元素是否为“display：none”或单击时阻止

Posted 2021-03-26

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

答案

您可以使用:visible作为可见元素，使用:hidden查找隐藏元素。这个隐藏的元素将display属性设置为none。

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

检查特定元素。

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

}

如果元素占用文档中的空间，则认为元素是可见的。可见元素的宽度或高度大于零，Reference

你也可以使用is()和:visible

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

}

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

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

}

如果您正在使用显示，则display可以拥有以下值。

显示：无

显示：内联

显示：块

display：list-item

display：内联块

检查可能的display值here的完整列表。

使用javascript检查显示属性

var isVisible = document.getElementById("yourID").style.display == "block";
var isHidden = document.getElementById("yourID").style.display == "none"; 

另一答案

$("element").filter(function() { return $(this).css("display") == "none" });

另一答案

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

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

    if ( $(this).css('display') == 'none')
    {
       //do something
    }
});

另一答案

$('#selector').is(':visible');

另一答案

使用这个条件：

if (jQuery(".profile-page-cont").css('display') == 'block'){
    // Condition 
}

另一答案

jQuery中有两种检查可见性的方法：

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

和

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

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

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

要么

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