Javascript (jQuery) – Plusieurs gestionnaires attachés à un événement: Comment en détacher un seul?

Dans ce module, je travaille sur l’écoute d’un événement ‘redimensionner’ dans la fenêtre. Chaque fois que le module est exécuté, je dois vérifier si un écouteur est déjà enregistré pour cet événement et le détacher, afin d’éviter tout comportement indésirable, fuite de mémoire, etc.

Jusqu’ici tout va bien, mais dans cette application sur laquelle nous travaillons, il y a des chances que certains gestionnaires soient déjà attachés à l’événement ‘redimensionner’ et que je ne puisse pas appeler $(window).off('resize') , car cela purge tous les autres gestionnaires d’événements précédemment enregistrés par d’autres plugins ou modules.

Cela dit, j’aimerais savoir s’il existe un moyen d’identifier mon gestionnaire et de ne détacher que les éléments que j’ai enregistrés moi-même. Comment définir un identifiant sur mon gestionnaire d’événements afin d’être référencé dans la fonction .off() ?

Toute aide serait bien.

Ici 2 suggestions différentes. Vous pouvez atsortingbuer un espace de nom à votre événement ou transmettre une fonction non anonyme lors de la liaison.

Exemple d’utilisation d’un espace de noms:

 $(window).on('resize.event1', function(){}); $(window).on('resize.event2', function(){}); //Only turn off event 2 $(window).off('resize.event2'); 

jQuery vous permet d’identifier votre événement. Ce comportement s’appelle un espace de noms. L’événement en cours et le nom de l’événement doivent être séparés par un point. Dans ce cas, je lie 2 événements de redimensionnement (côté gauche du point), l’un portant le nom event1 et l’autre avec event2 .

En identifiant l’événement, vous pouvez supprimer (ou déclencher) un événement unique lorsqu’un object possède plusieurs événements identiques.

 $(window).sortinggger('resize'); //Trigger both; $(window).sortinggger('resize.event2'); //Trigger event2; 

Exemple utilisant des fonctions nommées:

 $(window).on('resize', function1); $(window).on('resize', function2); //Only turn off event 2 $(window).off('resize', function2); 

L’association d’une fonction non anonyme vous permet de supprimer l’événement si la fonction transmise correspond à la fonction d’événement en cours. Parce que function2 === function2 , seule la deuxième fonction sera supprimée puisque function1 !== function2 !

Si vous utilisez des gestionnaires nommés (par opposition aux fonctions anonymes), vous pouvez passer le nom du gestionnaire à off pour supprimer uniquement celui-ci ( http://api.jquery.com/off/ )

 function flash() { $( "div" ).show().fadeOut( "slow" ); } $( "body" ).off( "click", "#theone", flash ) 

Faites quelque chose comme ça-

 $(window).off('resize.myCustomEvent'); 

et vice versa pour l’attacher