2012-06-25 4 views
39

Je cliquez sur les événements mis en place comme ceci:return false de l'événement click jQuery

$('.dialogLink') 
    .click(function() { 
     dialog(this); 
     return false; 
    }); 

Le tout un « return false »

Quelqu'un peut-il expliquer ce que cela fait et si cela est nécessaire?

Répondre

75

Lorsque vous renvoyez false à partir d'un gestionnaire d'événements, il empêche l'action par défaut pour cet événement et arrête l'événement qui bouillonne dans le DOM. À savoir, il est l'équivalent de le faire:

$('.dialogLink') 
    .click(function (event) { 
     dialog(this); 
     event.preventDefault(); 
     event.stopPropagation(); 
}); 

Si '.dialogLink' est un élément <a> alors son action par défaut sur clic pour accéder au href. Renvoyer false à partir du gestionnaire de clic empêche cela. Quant à savoir si cela est nécessaire dans votre cas, je suppose que la réponse est oui parce que vous voulez afficher une boîte de dialogue en réponse au clic plutôt que de naviguer. Si l'élément sur lequel vous avez placé le gestionnaire de clic n'a pas d'action par défaut sur le clic (par exemple, rien ne se produit normalement lorsque vous cliquez sur une div), vous n'avez pas besoin de retourner false car il n'y a rien à annuler.

Si vous voulez faire quelque chose en réponse au clic mais que la navigation par défaut continue, ne renvoyez pas false.

Pour en savoir plus:

+0

Serait-ce la même chose si je codais dans ces deux événements dans la fonction de dialogue? – Alan2

+1

Ces deux lignes ne sont pas des événements, ce sont des appels aux méthodes de l'objet 'event' que vous remarquerez avoir ajouté en tant que paramètre à la fonction. jQuery définit ce paramètre sur l'objet 'event' associé à l'événement qui s'est produit.Si vous avez passé l'objet 'event' à la fonction' dialog() ', alors il pourrait appeler ces méthodes, mais je pense que c'est beaucoup plus facile à maintenir si vous le faites directement là où je l'ai montré. Cela dit, je vous recommande de rester avec le 'return false' que vous avez déjà: c'est plus court. – nnnnnn

+0

En tant que quelqu'un qui vient de rencontrer ce problème et qui a pris un peu de temps pour comprendre ce qui se passait, je dirais que l'appel 'return false' n'est pas aussi clair que de dire preventDefault et stopPropagation. – aug

3

La valeur de retour d'un gestionnaire d'événements détermine si oui ou non le comportement par défaut du navigateur devrait avoir lieu aussi bien. Dans le cas de cliquer sur des liens, ce serait suivre le lien, mais la différence est plus visible dans les gestionnaires de soumission de formulaire, où vous pouvez annuler une soumission de formulaire si l'utilisateur a fait une erreur en entrant l'information.

Je ne crois pas qu'il existe une spécification W3C pour cela. Toutes les anciennes interfaces JavaScript comme celle-ci ont reçu le surnom "DOM 0" et sont pour la plupart non spécifiées. Vous pouvez avoir de la chance en lisant la vieille documentation de Netscape 2.

La manière moderne de réaliser cet effet est d'appeler event.preventDefault(), et ceci est spécifié dans le DOM 2 Events specification.

Ainsi, la bonne façon serait:

$('.dialogLink') 
    .click(function (e) { 
     dialog(this); 
     e.preventDefault(); 
     e.stopPropagation(); // Stop bubbling up 
}); 
+0

Vous mentionnez le moyen "moderne" mais si c'est juste le même n'est pas mieux de retourner code false et sauver quelques octets du script :-) – Alan2

+0

Si c'est un gestionnaire d'événement jQuery vous pouvez être sûr que 'return false' sera fait le travail. – nnnnnn

+0

Conclu avec @nnnnnn. –

0

La valeur de retour d'un gestionnaire d'événements détermine si oui ou non le comportement par défaut du navigateur devrait avoir lieu aussi bien. Dans le cas de cliquer sur des liens, ce serait suivre le lien, mais la différence est plus visible dans les gestionnaires de soumission de formulaire, où vous pouvez annuler une soumission de formulaire si l'utilisateur a fait une erreur en entrant l'information.

Questions connexes