jQuery .bind() vs .on()

Question

J'ai trouvé deux articles très parler de la nouvelle fonction .sur().

http://www.jquery4u.com/jquery-functions/on-vs-live-review/#.UCEUoKPrFI0

http://www.elijahmanor.com/2012/02/differences-between-jquery-bind-vs-live.html

Est-il possible lorsque l' .bind() encore mieux que les .sur()?

Par exemple: j'ai un exemple de code qui ressemblent à ça:

$("#container").click( function( e ) {} )

Vous pouvez noter que je viens d'avoir un article récupéré par le sélecteur, et dans mon cas, la div nommé #conteneur existent déjà lors de ma page a été chargé; pas ajoutés dynamiquement. Il est important de mentionner que j'utilise la dernière version de jquery; 1.7.2.

Pour cet échantillon, est .sur() doit être utilisé à la place de .bind (), même si je n'ai pas utiliser les autres fonctions prévues par la .() la fonction?

Answer 1

En interne, mappe directement à dans la dernière version de jQuery. (Il en va de même .) Donc il n’y a une baisse de performance minuscule mais pratiquement négligeable si vous utilisez au lieu de cela.

Cependant, peuvent être révoqués à tout moment des futures versions. Il n’y a aucune raison de continuer à utiliser et toutes les raisons de préférer `` à la place.

Answer 2

Ces extraits de tous fonctionnent exactement de la même chose:

element.on('click', function () { ... });
element.bind('click', function () { ... });
element.click(function () { ... });

Cependant, ils sont très différents de ceux-ci, qui remplissent tous la même chose:

element.on('selector', 'click', function () { ... });
element.delegate('click', 'selector', function () { ... });
$('selector').live('click', function () { ... });

Le deuxième ensemble de gestionnaires d'événements de l'utilisation de l'événement délégation et de travail pour ajouter dynamiquement des éléments. Les gestionnaires d'événements que l'utilisation de la délégation sont aussi beaucoup plus performant. La première série ne fonctionnera pas pour ajouter dynamiquement des éléments, et sont beaucoup plus mauvais pour la performance.

jQuery on() fonction n'introduit pas de nouvelles fonctionnalités qui n'existent déjà, c'est juste une tentative de normaliser la gestion des événements en jQuery (vous n'avez plus à choisir entre vivre, de se lier, ou de son délégué).

Answer 3

Les méthodes directes et .delegate sont supérieurs Api pour l' .on et l'intention n'est pas de l'autodérision.

Les méthodes directes sont préférables parce que votre code sera moins stringly tapé. Vous obtiendrez immédiatement une erreur lorsque vous faites une nom de l'événement plutôt qu'un silence de bug. À mon avis, il est aussi plus facile à lire et à écrire click que on("click"

L' .delegate est supérieure à .on en raison de l'argument de la commande:

$(elem).delegate( ".selector", {


    click: function() {

    },

    mousemove: function() {

    },


    mouseup: function() {

    },


    mousedown: function() {

    }





});

Vous savez immédiatement que c'est déléguée parce que, eh bien, dit-il délégué. Vous aussi instantanément voir le sélecteur.

Avec .on il n'est pas immédiatement clair si c'est la même délégué et vous avez à regarder la fin pour le sélecteur:

$(elem).on({


    click: function() {

    },

    mousemove: function() {

    },


    mouseup: function() {

    },


    mousedown: function() {

    }





}, "selector" );

Maintenant, le nom de l' .bind est vraiment terrible et est à la valeur nominale de pire que d' .on. Mais .delegate ne peut pas le faire non délégués, des événements et des sont des événements qui n'ont pas de méthode directe, de sorte que dans de rares cas comme cela, il pourrait être utilisé mais seulement parce que vous voulez faire une séparation nette entre les délégués et non délégués des événements.

Answer 4

Si vous regardez dans le code source de vous trouverez que c’est juste une fonction rewrite pour :

http://James.padolsey.com/jQuery/#v=1.7.2&fn=$. fn.bind

Answer 5

À partir du jQuery documentation:

Comme de jQuery 1.7, l' .() la méthode est la méthode préférée pour la fixation des gestionnaires d'événements dans un document. Pour les versions antérieures, l' .méthode bind() est utilisé pour attacher un gestionnaire d'événement directement à des éléments. Les gestionnaires sont attachés aux éléments sélectionnés dans l'objet jQuery, de sorte que ces éléments doivent exister au moment de l'appel .bind() se produit. Pour plus flexible de liaison d'événement, voir la discussion de cas de délégation .sur() ou .délégué().

http://api.jquery.com/bind/