Comment appliquer jQuery : sélecteur caché ?-js tutoriel-php.cn

Comment appliquer jQuery : sélecteur caché ?

黄舟

Libérer： 2017-06-23 11:41:02

original

1354 Les gens l'ont consulté

Aperçu

Correspond à tous les éléments invisibles, ou éléments de type caché

Exemple

Description :

Trouver des tr cachés

Code HTML :

<table> <tr style="display:none"><td>Value 1</td></tr> <tr><td>Value 2</td></tr> </table>

Copier après la connexion

Code jQuery :

$("tr:hidden")

Copier après la connexion

Résultat :

[ <tr style="display:none"><td>Value 1</td></tr> ]

Copier après la connexion

Description :

Correspond aux éléments de type caché

Code HTML :

<form> <input type="text" name="email" /> <input type="hidden" name="id" /> </form>

Copier après la connexion

Code jQuery :

$("input:hidden")

Copier après la connexion

Résultat :

[ <input type="hidden" name="id" /> ]

Copier après la connexion

Ce sélecteur est généralement utilisé en conjonction avec d'autres sélecteurs, tels que le sélecteur de classe et le sélecteur d'élément, etc. Par exemple :

$("div:hidden").css({display:"block",color:"blue"})

Copier après la connexion

Le code ci-dessus peut définir l'élément div caché pour qu'il soit visible et définir la couleur de la police à l'intérieur sur bleu.
S'il n'est pas utilisé avec d'autres sélecteurs, l'état par défaut est utilisé avec le sélecteur *, par exemple, $(":hidden") est équivalent à $("*:hidden").

Exemple de code :






 
 
 
 
 
 
我是后来才可见的 
我是本来就是可见的

Copier après la connexion

Le code ci-dessus peut définir le div caché pour qu'il soit visible et définir la couleur du texte à l'intérieur sur bleu.

Exemple 2 :

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title></title>
<style type="text/css">
.display {
display:none;
}
</style>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript"> 
$(document).ready(function(){ 
  $("button").click(function(){ 
    $(":hidden").css({display:"block",color:"blue"}); 
  }) 
}) 
</script>
</head>
<body>
<div class="display">我是后来才可见的</div>
<div>我是本来就是可见的</div>
<p class="display">我原来也是不可见的</p>
<button>点击查看效果</button>
</body>
</html>

Copier après la connexion

Étant donné que le code ci-dessus ne spécifie pas de sélecteur à utiliser avec le sélecteur :hidden, il est utilisé avec le sélecteur * par défaut, le code peut donc Tous les éléments masqués sont rendus visibles et la couleur du texte qu'ils contiennent est définie sur bleu.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!