triggerHandler vs déclencher en jQuery

à Partir de la documentation à http://api.jquery.com/triggerHandler/

le .la méthode triggerHandler() se comporte de la même façon .trigger (), avec le exceptions suivantes:

• le .triggerHandler() méthode ne provoque pas le comportement par défaut d'une événement à survenir (tel qu'un formulaire soumission.)

ne pas empêcher les actions par défaut du navigateur vous permet de spécifier une action qui se produit sur focus ou sélectionnez, etc etc, qui applique un style. Peut-être que vous avez un menu dynamique qui est basé sur Javascript, donc vous ne voulez pas appliquer le style purement avec CSS sinon ceux avec Javascript désactivé ne comprendra pas pourquoi la disposition semble étrange. Vous pouvez utiliser quelque chose comme $('menu1select').triggerHandler('click');

• pendant ce temps .trigger () fonctionnera sur tous les éléments assortis par le jQuery objet. ,triggerHandler () affecte seulement la première correspondait élément.

Si vous avez un événement qui cache un élément onclick par exemple, et vous souhaitez appeler cette fonction en général, au lieu d'avoir à spécifier chaque élément, vous pouvez utiliser $('.menu').triggerHandler('click');

• création d'Événements .triggerHandler() n'ont pas de bulle de l' Hiérarchie des DOM; si elles ne sont pas traitées par l'élément cible directement, ils de ne rien faire.

Empêche la propagation, hopyfully n'avez pas à expliquer celui-ci...

• au Lieu de retourner l'objet jQuery (pour permettre le chaînage), .triggerHandler () renvoie n'importe quoi la valeur renvoyée par la dernière gestionnaire il a causé à être exécuté. Si aucun les manipulateurs sont déclenchés, il retourne undefined

celui-ci doivent être explicites...

Quel est l'avantage de s'assurer que l'événement autochtone ne démarre pas?

• vous avez des actions liées à un événement 'focus' mais vous ne voulez pas que le navigateur se concentre vraiment focus it (peut sembler stupide mais il pourrait arriver, ne pourrait-il pas? comme un code que vous voulez exécuter une fois sans perdre le focus actuel).

• Un composant que vous souhaitez déclencher la "charge" (juste un exemple générique d'une chose) d'un autre composant qui est à l'intérieur.

  dans ce cas, si vous appelez 'load' des enfants quand 'load' du parent vient, vous ne voulez pas faire cela parce que cela causerait un appel infini si l'événement.stopPropagation n'est pas appelé par les auditeurs de la "charge" de l'événement (causée par bubling):

$container.on('load', function () {
    $somethingInsideContainer.trigger('load'); 
    // Would cause a loop if no event.stopPropagation() is called
});

Dans ce cas, vous devez appeler triggerHandler().

Différence de 1: vous pouvez appeler tous les éléments correspondant à L'objet JQuery en utilisant trigger.

//Exemple1 pour déclencher. Tous les évènements de clic sur les 3 boutons sont déclenchés lorsqu'ils sont utilisés. // Essayez de remplacer la méthode trigger par triggerHandler (). Vous verrez seulement le premier élément de bouton gestionnaire d'événements feu .

<button id = "button1">button1</button>
<button id = "button2">button2</button>
<button id = "button3">button3</button>

$("#button1").on("click", function(){
alert("button1 clicked");
});
$("#button2").on("click", function(){
alert("button2 clicked");
});
$("#button3").on("click", function(){
alert("button3 clicked");
});

//substitut de déclenchement avec triggerHandler pour voir la différence

$("#button1, #button2, #button3").trigger("click");

Différence 2: lors de l'utilisation de triggerHandler () pour un événement element, l'événement natif ne sera pas appelé pour cet élément. trigger() fonctionne correctement.

//Exemple:

//substitut de déclenchement avec triggerHandler pour voir la différence

 <button id = "button1">button1</button>
  <button id = "button2">button2</button>

$("#button1").on("click", function(){
 $("#button2").trigger('click');

});

$("#button3").on("click", function(){
var value = $("#button2").triggerHandler('click');
    alert('my value:'+ value)
});

$("#button2").on('click', function(){
alert("button2 clicked");

});

Différence de 3: trigger() renvoie l'objet Jquery tandis que triggerHandler () renvoie la dernière valeur de la poignée ou si aucun handlers n'est déclenché, il renvoie unefined

//Exemple3

<button id="button1">Button1</button>
<button id="button2">Button2</button>
<button id="button3">Button3</button>


$("#button1").on("click", function(){
var myValue = $("#button2").trigger('click');
    alert(myValue);
});

$("#button3").on("click", function(){
var value = $("#button2").triggerHandler('click');
    alert('my value:'+ value)
});

$("#button2").on('click', function(){
alert("button2 clicked");
    return true;
});

Autre différence

les événements déclenchés avec triggerHandler () ne font pas de bulles dans la hiérarchie du DOM; s'ils ne sont pas traités directement par l'élément cible, ils ne font rien.

donc, pour un handler tel que:

  $( document ).on( 'testevent', function ()
  {
    return false;
  });

en utilisant 'triggerHandler' vous pouvez faire ce qui suit:

  if( $( document ).triggerHandler( 'testevent' ) === false )
  {
    return;
  }

ainsi vous utiliserez 'triggerHandler' si vous voulez répondre au résultat retourné par le handler.