Maison >interface Web >js tutoriel >Explication graphique détaillée de trois méthodes d'événement de clic sur le bouton jQuery
Explication graphique détaillée de trois méthodes d'événement de clic sur le bouton jQuery
- yuliaoriginal
- 2018-10-12 10:25:369191parcourir
jQuery est un framework basé sur JavaScript et est largement utilisé en raison de sa simplicité et de sa commodité. Savez-vous comment définir l'événement de clic du bouton jQuery ? Cet article vous expliquera la méthode de déclenchement de l'événement de clic jQuery. Il a une certaine valeur de référence. Les amis intéressés peuvent s'y référer.
Un article précédent vous a parlé de la méthode de traitement des événements de clic de bouton en JavaScript Si vous en avez besoin, vous pouvez y jeter un œil. Ensuite, nous expliquerons directement l'événement de clic de bouton jQuery. .
Remarque : lorsque vous utilisez jQuery, vous devez d'abord introduire le fichier jQuery
Méthode 1. $ ("bouton").click(function () { })
Un événement de clic se produit lorsqu'un élément de clic est cliqué. La méthode click() peut déclencher un événement de clic, qui stipule que la fonction. sera exécuté lorsqu'un événement de clic se produit.
Syntaxe : $(selector).click(function)
Exemple : Lorsque vous cliquez sur le bouton, l'événement de clic est déclenché et la boîte de dialogue affiche un élément de contenu.
Le code est le suivant :
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<button>click</button>
</body>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
alert("祝你好运");
});
});
</script>
</html>Rendu :
Méthode 2, La méthode $( "button").on("click",function () { })
on() peut ajouter un ou plusieurs événements à l'élément et aux sous-éléments sélectionnés si vous en avez besoin. pour supprimer l'événement, vous pouvez utiliser la méthode off().
Syntaxe : $(selector).on(event,childSelector,data,function)
Le code est le suivant :
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<button>点我</button>
</body>
<script type="text/javascript">
$(document).ready(function(){
$("button").on("click",function(){
alert("have a nice day ");
});
});
</script>
</html>Méthode 3, La méthode $(" button").bind("click",function(){ })
bind() peut ajouter un ou plusieurs événements à l'élément sélectionné, et la fonction sera exécutée lorsque l'événement se produit.
Syntaxe : $(selector).bind(event,data,function,map)
Le code est le suivant :
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<button>按钮</button>
</body>
<script type="text/javascript">
$(document).ready(function(){
$("button").bind("click",function(){
alert("阳光总在风雨后");
});
});
</script>
</html>Ce qui précède introduit le clic sur le bouton événement dans jQuery Les trois méthodes sont toutes différentes. Quant à la méthode à choisir, cela dépend aussi des besoins professionnels et des habitudes personnelles. Les débutants peuvent l'essayer par eux-mêmes.
Pour plus de didacticiels connexes, veuillez visiter le Tutoriel vidéo jQuery
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!