web-dev-qa-db-fra.com

renvoie false à partir de l'événement de clic jQuery

J'ai des événements de clic configurés comme ceci:

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

Tous ont un "retour faux"

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

54
Alan2

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

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

Si '.dialogLink' est un <a> élément alors son action par défaut au clic est de naviguer vers le href. Renvoyer false du gestionnaire de clics empêche cela.

Pour ce qui est de savoir si cela est nécessaire dans votre cas, je suppose que la réponse est oui car vous souhaitez 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 clics n'a pas d'action par défaut (par exemple, normalement rien ne se passe lorsque vous cliquez sur un div), vous n'avez pas besoin de renvoyer false car il n'y a rien à annuler.

Si vous voulez faire quelque chose en réponse au clic mais laisser la navigation par défaut continuer, ne retournez pas false.

Lectures complémentaires:

92
nnnnnn

La valeur de retour d'un gestionnaire d'événements détermine si le comportement du navigateur par défaut doit également avoir lieu. En cas de clic sur des liens, le lien suivrait, mais la différence est plus notable dans les gestionnaires de soumission de formulaire, dans lesquels vous pouvez annuler une soumission de formulaire si l'utilisateur a commis une erreur en saisissant les informations.

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 aurez peut-être de la chance en lisant l’ancienne documentation de Netscape 2.

La manière moderne d’atteindre cet effet consiste à appeler event.preventDefault(), et cela est spécifié dans le spécification DOM 2 Events .

Donc, la bonne façon serait:

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