Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

triggerHandler vs. trigger in jQuery

Out of curiosity -- what is the purpose of / use cases for jQuery's triggerHandler? As far as I can tell, the only "real" differences between trigger and triggerHandler is whether or not the native event fires, and event bubbling behavior (though triggerHandler's bubbling behavior doesn't seem hard to replicate with trigger in a few more lines of code). What is the advantage to ensuring the native event does not fire?

I'm curious if this is a convenience function or there's a deeper reason it exists, and what why/when I would use it.

like image 303
David Eads Avatar asked Sep 22 '10 18:09

David Eads


People also ask

What is triggerHandler?

Definition and Usage. The triggerHandler() method triggers the specified event for the selected element. This method is similar to the trigger() method, except that trigger() also triggers the default behavior of an event (like form submission).

What is trigger in jquery?

The trigger() method triggers the specified event and the default behavior of an event (like form submission) for the selected elements. This method is similar to the triggerHandler() method, except that triggerHandler() does not trigger the default behavior of the event.


1 Answers

From the Docs at http://api.jquery.com/triggerHandler/

The .triggerHandler() method behaves similarly to .trigger(), with the following exceptions:

  • The .triggerHandler() method does not cause the default behavior of an event to occur (such as a form submission).

Not preventing the default browser actions allow you to specify an action that occurs on focus or select, etc etc etc, that applies a style. Maybe you have a dynamic menu that is Javascript based, so you don't want to apply the style purely with CSS otherwise those with Javascript disabled won't understand why the layout looks odd. You can use something like $('menu1select').triggerHandler('click');

  • While .trigger() will operate on all elements matched by the jQuery object, .triggerHandler() only affects the first matched element.

If you have an event which hides an element onclick for example, and you want to call that function generally, instead of having to specify each element, you can use $('.menu').triggerHandler('click');

  • Events created with .triggerHandler() do not bubble up the DOM hierarchy; if they are not handled by the target element directly, they do nothing.

Prevents propagation, hopyfully don't have to explain this one...

  • Instead of returning the jQuery object (to allow chaining), .triggerHandler() returns whatever value was returned by the last handler it caused to be executed. If no handlers are triggered, it returns undefined

This one should be self explanatory as well...

like image 103
Robert Avatar answered Sep 21 '22 18:09

Robert