jQuery: $ (). click (fn) contre $ (). bind ('click', fn);

115

Lorsque vous utilisez jQuery pour connecter un gestionnaire d'événements, y a-t-il une différence entre l'utilisation de la méthode click

$().click(fn)

par rapport à l'utilisation de la méthode bind

$().bind('click',fn);

Autre que le paramètre de données facultatif de bind.

Alan Storm
la source
On dirait que click a également le paramètre de données facultatif. Quelqu'un sait-il s'il y a des différences entre son fonctionnement? Source: api.jquery.com/click
Nick Udell

Réponses:

137

Pour ce que ça vaut, à partir de la source jQuery :

jQuery.each( ("blur,focus,load,resize,scroll,unload,click,dblclick," +
    "mousedown,mouseup,mousemove,mouseover,mouseout,mouseenter,mouseleave," +
    "change,select,submit,keydown,keypress,keyup,error").split(","), function(i, name){

    // Handle event binding
    jQuery.fn[name] = function(fn){
        return fn ? this.bind(name, fn) : this.trigger(name);
    };
});

Alors non, il n'y a pas de différence -

$().click(fn)

appels

$().bind('click',fn)
Matthieu Maravillas
la source
6
Vrai - click()est fondamentalement un raccourci pour bind('click')(ou, à cette époque, il appelle réellement on('click'). La façon dont je le vois, vous pourriez aussi bien vous sauver cet appel de fonction supplémentaire en utilisant on('click')directement.
Nix
Ils font la même chose mais bind () disons que je veux que quelque chose se produise lorsque l'utilisation survole ET clique, etc. Voir stackoverflow.com/a/519455/292408 ci-dessous pour l'exemple. Vous ne pouvez bien sûr vous lier qu'à un seul événement, par exemple «clic» également.
Elijah Lynn
98

+1 pour la réponse de Matthew, mais j'ai pensé que je devrais mentionner que vous pouvez également lier plus d'un gestionnaire d'événements en une seule fois en utilisant bind

$('#myDiv').bind('mouseover focus', function() {
    $(this).addClass('focus')
});

qui est l'équivalent beaucoup plus propre de:

var myFunc = function() {
    $(this).addClass('focus');
};
$('#myDiv')
    .mouseover(myFunc)
    .focus(myFunc)
;
nickf
la source
20
+1 Que lier plusieurs événements est une nouvelle pour moi et peut-être très utile.
cletus
1

Il y a le paramètre [data] de la liaison qui ne se produira qu'une seule fois au moment de la liaison.

Vous pouvez également spécifier des événements personnalisés comme premier paramètre de bind.

Aaron
la source
1

Je trouve que le .click () est beaucoup plus logique, mais je suppose que c'est ainsi que vous pensez les choses.

$('#my_button').click(function() { alert('BOOM!'); });

Cela semble être aussi simple que possible.

JedH
la source
0

Si vous avez Google Chrome, leurs outils de développement ont un outil d'écoute d'événements, sélectionnez l'élément que vous souhaitez espionner son événement.

Vous constaterez que les deux méthodes conduisent au même résultat, elles sont donc équivalentes.

Omar Abid
la source
0

Je préfère .bind () en raison de sa cohérence d'interface avec .live () . Non seulement cela rend le code plus lisible, mais cela facilite également la modification d'une ligne de code pour utiliser une méthode au lieu de l'autre.

Danorton
la source