Qual è la differenza tra .delegate() e live()?

Question

Dal

$("table").delegate("td", "hover", function(){ 
    $(this).toggleClass("hover"); 
}); 

è equivalente al seguente codice scritto utilizzando .Live():

$("table").each(function(){ 
    $("td", this).live("hover", function(){ 
     $(this).toggleClass("hover"); 
    }); 
}); 

secondo i jQuery API.

Scommetto che mi sbaglio, ma non è lo stesso di scrivere

$("table td").live('hover', function() {}); 

Allora, cosa è .delegate() per?

Answer 1

.live() ascolti su document dove come .delegate() ascolta su un elemento più locale, il <table> in quel caso.

Entrambi si comportano allo stesso modo in cui gli eventi sono in bolla, quello a .delegate() solo bolle in meno prima di essere catturati.

Il tuo esempio di:

$("table td").live('hover', function() {}); 

non è la stessa, in quanto attribuisce ancora una volta un gestore di eventi per document e non il <table>, quindi .delegate() è per gli elementi più locale, più efficienti sotto molti aspetti .. . Anche se utilizza ancora .live() sotto le coperte.

---

Anche tenere a mente che $(selector) recupera gli elementi, in modo da $("table td") seleziona un gruppo di elementi davvero per nessuna buona ragione quando si utilizza .live(), dove come $("table").delegate() seleziona solo gli <table> elementi, quindi, anche inizialmente è più efficiente non eseguendo il selettore e scartando il risultato.

Answer 2

Il dottore:

Poiché il metodo .Live() gestisce gli eventi una volta che hanno propagato all'inizio del documento, non è possibile fermare la propagazione di eventi dal vivo. Allo stesso modo, gli eventi gestiti da .delegate() si propagano sempre all'elemento a cui sono delegati; i gestori di eventi su qualsiasi elemento sottostante saranno già stati eseguiti dal momento in cui viene chiamato il gestore di eventi delegato.

Answer 3

Il modo live() opere è che essa pone un gestore al livello superiore del DOM (il documento) che rileva quando il vostro evento prescelto bolle fino a quel livello (e poi controlla per vedere se è stato gettato da un elemento che corrisponde al tuo selettore).

delegate() funziona allo stesso modo, ma il gestore viene posizionato sull'elemento selezionato (in modo che possa rilevare solo gli eventi lanciati dai discendenti di quell'elemento).

I lati negativi di live() sono 1) i problemi di prestazioni inerenti al rilevamento e al controllo di tutti gli eventi che sono a livello di documento e 2) il fatto che non è possibile interrompere la propagazione su quegli eventi (poiché hai vinto " li conosco fino a quando raggiungono il livello del documento).

delegate() attenua entrambi questi problemi consentendo di limitare il gestore a un insieme più piccolo di elementi (gli elementi che corrispondono al selettore e ai loro discendenti) piuttosto che all'intera pagina.