Comment vérifier si un élément HTML est caché en jQuery

juillet 4, 2019février 10, 2020 Amine KOUIS Aucun commentaire

Le sélecteur :hidden en jQuery peut être utilisé pour tester si un élément est masqué ou non sur une page. Vous pouvez également utiliser ce sélecteur pour tester les éléments dont la largeur et la hauteur sont définis sur 0, ainsi que les éléments de formulaire avec l’attribut type = "hidden".

Code HTML :

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Vérifier si un élément HTML est caché</title>
		<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
		<script type="text/javascript">
			// Mettez le code jQuery ici.
		</script>
	</head>
	<body>
		<button type="button">Afficher/cacher le paragraphe</button>
		<p>Ceci est un paragraphe</p>
	</body> 
</html>

Code jQuery :

$(document).ready(function() {
    $("button").click(function() {
        $("p").toggle("slow", function() {
            if ($("p").is(":hidden")) {
                alert("Le paragraphe est caché.");
            } else {
                alert("Le paragraphe est visible.");
            }
        });
    });
});