Les façons d'ajouter des événements jquery sont : 1. Utilisez JavaScript directement sur la balise, le code est concis et facile à comprendre sans introduire d'autres bibliothèques ou fichiers ; 2. Utilisez « onclick » « onmouseover » et d'autres méthodes pour le réorganiser en ; un fichier JavaScript séparé, plus facile à gérer et à partager ; 3. Événement de liaison ".bind()", qui peut lier plusieurs gestionnaires d'événements à un seul élément ; 4. Événement de liaison ".on()", qui prend en charge les gestionnaires d'événements délégués. complexité du code.
Le système d'exploitation de ce tutoriel : système Windows 10, jQuery version 3.6.0, ordinateur Dell G3.
jQuery propose de nombreuses façons d'ajouter des gestionnaires d'événements, en voici quatre :
1 Utilisez JavaScript directement sur l'étiquette
```HTML <button onclick="alert('Hello world!')">Click Me</button> ```
Avantages :
Le code est simple et facile à comprendre
. Pas besoin d'introduire d'autres bibliothèques ou fichiers
Inconvénients :
Pas propice à la maintenance et à la réutilisation
Couplage élevé, les codes JavaScript et HTML sont mélangés
2. Utilisez la méthode élément `. onclick ` / `onmouseover` etc
```HTML <button id="foo">Click Me</button> ``` ```javascript $('#foo').click(function() { alert('Hello world!'); }); ```
Avantages :
Par rapport à l'utilisation de JavaScript directement sur la balise, le code peut être réorganisé dans un fichier JavaScript séparé, plus facile à gérer et à partager
Prend en charge les chaînes
Inconvénients :
S'il y a un grand nombre d'événements et de gestionnaires à mettre en place, cette méthode peut devenir verbeuse et difficile à maintenir
Les méthodes objet s'appuient sur des événements liés au cycle de vie de l'objet lui-même
3. Utilisez `.bind()` pour lier des événements
```HTML <button id="foo">Click Me</button> ``` ```javascript var foo = function() { alert('Hello world!'); }; $('#foo').bind('click', foo); ```
Avantages :
Vous pouvez lier plusieurs gestionnaires d'événements à un seul élément
`$.bind()` Et la méthode `$.unbind()` peut être utilisée pour surveiller le processus d'inscription/désinscription d'un événement
Inconvénients :
`.bind()` est obsolète dans jQuery version 3.0, il est recommandé d'utiliser ` .on()`
4. Utilisez `.on()` pour lier des événements
Ce qui suit est un exemple de code pour la liaison d'événements à l'aide de la méthode `.on()` de jQuery :
```javascript $(document).on('click', '#myButton', function() { // 事件处理程序 }); ```
`.on ()` Méthode Peut accepter trois paramètres. Le premier paramètre est le type d'événement à écouter/lié ; le deuxième paramètre est une chaîne de sélection facultative ou un nœud DOM, utilisé pour limiter l'ensemble des éléments de réponse ; le troisième paramètre est la fonction de rappel, qui correspond au moment où l'événement se produit ; action à réaliser.
Avantages : La méthode
`.on()` vous permet d'ajouter plusieurs gestionnaires d'événements pour les documents/éléments avec une grande flexibilité.
Le gestionnaire d'événements ajouté peut être supprimé via la méthode `off()`. La méthode
`.on()` prend également en charge les gestionnaires d'événements délégués, ce qui réduira considérablement la complexité du code lors de l'utilisation d'un grand nombre d'éléments ou de l'ajout dynamique d'éléments.
Inconvénients :
En fonction du nombre d'événements et d'éléments attachés, la liaison directe de nombreux gestionnaires d'événements peut entraîner des problèmes de performances.
Vous ne pouvez pas utiliser `.on()` dans l'ancien code avec une version de jQuery inférieure à 1.7, vous devez utiliser d'autres méthodes telles que `.bind()` (notez que cette méthode sera également obsolète à l'avenir ) et `.delegate ()`.
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!