Vérifiez, en utilisant jQuery, si un élément est 'display:none' ou bloc au clic

Question

Je veux vérifier et trier les éléments qui sont cachés. Est-il possible de trouver tous les éléments avec l'attribut display et la valeur none ?

Answer 1

Vous pouvez utiliser :visible pour les éléments visibles et :hidden pour trouver les éléments cachés. Ces éléments cachés ont l'attribut display défini sur none.

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

Pour vérifier un élément particulier.

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

}

Les éléments sont considérés visibles s'ils occupent de l'espace dans le document. Les éléments visibles ont une largeur ou une hauteur supérieure à zéro, Référence

Vous pouvez également utiliser is() avec :visible

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

}

Si vous souhaitez vérifier la valeur de l'affichage, vous pouvez utiliser css()

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

}

Si vous utilisez l'affichage, les valeurs suivantes display peuvent avoir.

display: none

display: inline

display: block

display: list-item

display: inline-block

Vérifiez la liste complète des valeurs possibles de display ici.

Pour vérifier la propriété d'affichage avec JavaScript

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

Answer 2

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

Answer 3

Oui, vous pouvez utiliser la fonction css. Ce qui suit recherchera tous les divs, mais vous pouvez le modifier pour les éléments dont vous avez besoin

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

    if ( $(this).css('display') == 'none')
    {
       //faire quelque chose
    }
});

Answer 4

Il existe deux méthodes en jQuery pour vérifier la visibilité :

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

et

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

Vous pouvez également exécuter des commandes en fonction de la visibilité du sélecteur :

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

ou

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

Answer 5

Utilisez cette condition :

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