Metodo JQuery .on() con più gestori di eventi su un solo selettore

Question

Cercando di capire come utilizzare il metodo .on() di Jquery con un selettore specifico a cui sono associati più eventi. In precedenza utilizzavo il metodo .live(), ma non ero sicuro di come ottenere lo stesso risultato con .on(). Si prega di vedere il mio codice qui sotto:

$("table.planning_grid td").live({ 
    mouseenter:function(){ 
    $(this).parent("tr").find("a.delete").show(); 
    }, 
    mouseleave:function(){ 
    $(this).parent("tr").find("a.delete").hide();   
    }, 
    click:function(){ 
    //do something else. 
    } 
}); 

so di poter assegnare i molteplici eventi chiamando:

$("table.planning_grid td").on({ 
    mouseenter:function(){ //see above 
    }, 
    mouseleave:function(){ //see above 
    } 
    click:function(){ //etc 
    } 
    }); 

Ma credo che il corretto utilizzo del .on() sarebbe in questo modo:

$("table.planning_grid").on('mouseenter','td',function(){}); 

C'è un modo per realizzare questo? O qual è la migliore pratica qui? Ho provato il codice qui sotto, ma senza dadi.

$("table.planning_grid").on('td',{ 
    mouseenter: function(){ /* event1 */ }, 
    mouseleave: function(){ /* event2 */ }, 
    click: function(){ /* event3 */ } 
}); 

Grazie in anticipo!

Answer 1

Questo è the other way around. Si dovrebbe scrivere:

$("table.planning_grid").on({ 
    mouseenter: function() { 
     // Handle mouseenter... 
    }, 
    mouseleave: function() { 
     // Handle mouseleave... 
    }, 
    click: function() { 
     // Handle click... 
    } 
}, "td");