jQuery cacher et afficher

jQuery hide() et show()

Avec jQuery, vous pouvez masquer et afficher des éléments HTML à l'aide des méthodes hide() et show() :

Exemple

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
    </script>
    <script>
        $(document).ready(function(){
            $("#hide").click(function(){
                $("p").hide();
            });
            $("#show").click(function(){
                $("p").show();
            });
        });
    </script>
</head>
<body>
<p>如果你点击“隐藏” 按钮,我将会消失。</p>
<button id="hide">隐藏</button>
<button id="show">显示</button>
</body>
</html>

Exécutez le programme et essayez-le


Syntaxe :

$(selector).hide(speed,callback);

$(selector).show(speed,callback);

Paramètre de vitesse facultatif Spécifie la vitesse de masquage/affichage, qui peut prendre les valeurs suivantes : "lent (lent)", "rapide (rapide)" ou millisecondes.

Le paramètre de rappel facultatif est le nom de la fonction à exécuter une fois le masquage ou l'affichage terminé.

L'exemple suivant montre la méthode hide() avec le paramètre speed :

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
    </script>
    <script>
        $(document).ready(function(){
            $("button").click(function(){
                $("p").hide(1000);
            });
        });
    </script>
</head>
<body>
<button>隐藏</button>
<p>生活就是做出选择,一旦你做出了你的选择,你就必须活在你的决定中。</p>
</body>
</html>

Exécutez le programme pour l'essayer


jQuery toggle()

Avec jQuery, vous pouvez utiliser la méthode toggle() pour changer les méthodes hide() et show().

Afficher les éléments cachés et masquer les éléments affichés :

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
    </script>
    <script>
        $(document).ready(function(){
            $("button").click(function(){
                $("p").toggle();
            });
        });
    </script>
</head>
<body>
<button>隐藏/显示</button>
<p>真正的失败不是你没有做成事,而是你甘心于失败。</p>
<p>一切都会好起来的,即使不是在今天,总有一天会的。</p>
</body>
</html>

Exécutez le programme et essayez-le


Syntaxe :

$(selector).toggle(speed,callback);

Le paramètre optionnel speed spécifie la vitesse de masquage/affichage, et peut prendre les valeurs suivantes : " lent", "rapide" ou millisecondes.

Le paramètre de rappel facultatif est le nom de la fonction à exécuter une fois la méthode toggle() terminée.



Formation continue
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ $("button").click(function(){ $("p").toggle(); }); }); </script> </head> <body> <button>隐藏/显示</button> <p>真正的失败不是你没有做成事,而是你甘心于失败。</p> <p>一切都会好起来的,即使不是在今天,总有一天会的。</p> </body> </html>
soumettreRéinitialiser le code
  • Recommandations de cours
  • Téléchargement du didacticiel
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!