Maison > Article > interface Web > Comment utiliser js pour masquer et afficher le bouton au clic ?
Comment utiliser js pour masquer et afficher le bouton au clic ?
- 藏色散人original
- 2018-08-06 14:55:4623373parcourir
Cet article présente principalement comment utiliser js pour réaliser les effets de masquage et d'affichage des boutons cliqués, ce qui est plus pratique pour l'expérience utilisateur.
Remarque : jQuery est un framework JavaScript rapide et concis. Il s'agit d'une autre excellente bibliothèque de code JavaScript (ou framework JavaScript) après Prototype. Le but de la conception de jQuery est « écrire moins, faire plus », ce qui signifie écrire moins de code et faire plus de choses. Il encapsule les codes fonctionnels couramment utilisés en JavaScript, fournit un modèle de conception JavaScript simple et optimise les opérations sur les documents HTML, le traitement des événements, la conception d'animations et l'interaction Ajax.
JS pour implémenter l'effet de masquage et d'affichage lorsque vous cliquez sur un bouton. Les exemples de code spécifiques sont les suivants :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#hide").click(function(){
$("p").hide();
});
$("#show").click(function(){
$("p").show();
});
});
</script>
</head>
<body>
<p id="p1">如果点击“隐藏”按钮，就会消失，点击“显示”就会出现。</p>
<button id="hide" type="button">隐藏</button>
<button id="show" type="button">显示</button>
</body>
</html>Vous pouvez directement copier le code ci-dessus. pour une démonstration locale. J'espère que cette introduction à l'article sera utile à tout le monde.
[Recommandations d'articles connexes]
Comment ajouter des événements de clic dans js
jQuery déclenche des événements de clic par défaut sur la première page d'exécution
JQuery simule des événements de clic et déclenche automatiquement des événements
Explication détaillée du conflit entre les événements de survol et de clic dans jQuery (photo)
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!