Explication graphique détaillée de trois méthodes d'événement de clic sur le bouton jQuery-js tutoriel-php.cn

Explication graphique détaillée de trois méthodes d'événement de clic sur le bouton jQuery

yulia

Libérer： 2018-10-12 10:25:36

original

9206 Les gens l'ont consulté

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>

Copier après la connexion

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>

Copier après la connexion

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>

Copier après la connexion

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!