JQuery syntax for multiple delegated events

The jQuery docs at http://api.jquery.com/on/ mention the benefits of delegated events using the following syntax (which attaches an event handler to only one element):

$('#mytable').on('click', 'tr.hoverable', function(){ // blah }); 

But I can not find the link to the correct syntax for attaching multiple events WITH delegated-events at the same time. Is there a shortcut for the following, but with tr.hoverable as a delegated event?

 $('#mytable tr.hoverable').on({ mouseenter: function(){ // blah }, mouseleave: function(){ // blah }, click: function(){ // blah } }); 

Or is this the only solution ...

 $('#mytable').on('click', 'tr.hoverable', function(){ // blah }).on('mouseenter', 'tr.hoverable', function(){ // blah }).on('mouseleave', 'tr.hoverable', function(){ // blah }); 

?

+8
jquery
source share
1 answer
 $('#mytable').on({ mouseenter: function(){ // blah }, mouseleave: function(){ // blah }, click: function(){ // blah } }, '.hoverable'); 

In accordance with this signature :

.on (event-map [, selector] [, data])

Also, prefer single tagName / className / id selectors for delegation as they are optimized.

+10
source share

All Articles