Dans jQuery, utilisez bind, live ou on_jquery pour lier les futurs événements d'éléments.-js tutoriel-php.cn

Dans jQuery, utilisez bind, live ou on_jquery pour lier les futurs événements d'éléments.

WBOY

Libérer： 2016-05-16 16:51:58

original

1070 Les gens l'ont consulté

Vous ne pouvez pas utiliser bind pour les futurs événements de liaison d'éléments.

1 Vous pouvez utiliser live à la place, mais faites attention à la version de jquery. Selon la documentation officielle, live et délégué ne sont pas recommandés à partir de la version 1.7 et le seront. être supprimé dans 1.9 live.

2. Il est recommandé d'utiliser on à la place (remarque : uniquement pris en charge par les versions 1.7 et supérieures). Utilisation : on(events,[selector],[data],fn)

Copier le code Le code est le suivant :

 
//Il n'est valide que lorsqu'il est placé dans $(function(){})
$(document).on("click", "#testDiv", function(){ 
 //Ici, $(this) fait référence à $( "#testDiv"), pas à $(document) 
}); 

3. élément correspondant (comme click ) Lors de la liaison d'une fonction de traitement d'événement unique, utilisez simplement .one() au lieu de on. Notez qu'elle n'est pas exécutée une fois sur tous les [sélecteurs], mais une seule fois sur ces [sélections]. valable pour les éléments futurs.

4. S'il y a trois boutons d'ajout, de suppression ou de modification dans un div qui doivent être liés à des événements, écrivez comme suit :

Copier le code Le code est le suivant :

 
$('#btn-add').click(function(){}); '#btn-del').click (function(){}); 
$('#btn-edit').click(function(){});

L'inconvénient d'écrire ainsi : vous ne pouvez pas voir la différence entre les trois connexions structurelles, aucune raison pour que les événements bouillonnent.

Jetons un coup d'œil aux recommandations de CoffeeDeveloper pour quelques réflexions sur la liaison d'événements jQuery. Cela peut être écrit comme ceci :

Copier le code Le code est le suivant :

$("#btnContainer").coffee({

cliquez : { 
"#btn-add": function(){ //faire quelque chose }, 
"#btn-del": function(){ //faire quelque chose }, 
"#btn-edit": function(){ //faire quelque chose } 
} , 
 mouseenter :{ 
"#btn-abc": function(){ //faire quelque chose }, 
} 
}); 

 
L'écrire comme ça, n'est-ce pas beaucoup mieux ? (.coffee() est une fonction personnalisée. Pouvez-vous écrire cette fonction vous-même ?) Cependant, si la fonction liée est relativement longue, le code semble toujours un peu brouillon 

Copier le code Le code est le suivant : $('#btnContainer')

.on ('cliquez','# btn-add', function(){})

.on('cliquez','#btn-del', function(){}) 
.on('cliquez' ,'#btn-edit' ,function(){}); 

 
Cette façon d'écrire évite également les deux inconvénients mentionnés ci-dessus et semble moins compliquée.