Suggerimento rapido la differenza tra Live () e Delegate ()

In jQuery 1.3, il team ha introdotto il metodo live (), che ci consente di associare i gestori di eventi agli elementi della pagina, nonché a quelli che potrebbero essere creati in futuro in modo dinamico. Sebbene non perfetto, si è rivelato sicuramente utile. In particolare, live () bolle fino in fondo e allega il gestore al documento. Sfortunatamente, cessa di funzionare bene anche quando si incatenano alle chiamate di metodo. Delegato () è stato introdotto nella versione 1.4, che quasi fa la stessa cosa, ma in modo più efficiente.

Esamineremo le differenze specifiche tra i due metodi nel suggerimento rapido del video di oggi. Grazie all'estensione Firebug di FireQuery, avremo gli strumenti per capire più facilmente come funziona ogni metodo.

Opzioni di visualizzazione alternative

Screenr (MP4)

   Cliccami

 // Bind allega un gestore di eventi solo agli elementi // che corrispondono a un particolare selettore. Questo, prevedibilmente, // esclude qualsiasi elemento generato dinamicamente. $ ("# elementi li"). click (function () $ (this) .parent (). append ("Nuovo elemento
");); // Live (), introdotto in 1.3, consente il binding // dei gestori di eventi a tutti gli elementi che corrispondono a un selettore //, compresi quelli creati in futuro. // Fa questo allegando il gestore del documento. // Sfortunatamente, non funziona bene con il concatenamento. // Non aspettatevi di concatenare live () dopo chiamate come // children (). next () ... etc. $ ("li"). live ("click", function () $ (this) .parent (). append ("Nuovo elemento
"), Il delegato, nuovo alla versione 1.4, forse avrebbe dovuto essere un completo // sostituto di Live (). Tuttavia, ovviamente // avrebbe rotto un sacco di codice! Tuttavia, // delegare rimedi a molti delle scorciatoie // trovate in live (). Allega il gestore di eventi // direttamente al contesto, piuttosto che al documento. // Inoltre non soffre dei problemi di concatenamento // che vivono. molti vantaggi prestazionali // utilizzare questo metodo su live (). $ ('# items'). delegate ('li', 'click', function () $ (this) .parent (). append ('Nuovo elemento
'); ); // Passando un elemento DOM come contesto del nostro selettore, possiamo rendere // Live () si comporta (quasi) allo stesso modo di delegate () //. Allega il gestore al contesto, non // al documento, che è il contesto predefinito. // Il codice seguente è equivalente alla versione delegate () // mostrata sopra. $ ("li", $ ("# items") [0]). live ("click", function () $ (this) .parent (). append ("Nuovo elemento
"););

Conclusione

Questo può sicuramente essere un argomento confuso. Non esitate a fare domande o discutere all'interno dei commenti. Grazie mille a Elijah Manor per aver chiarito un paio di cose per me su questo argomento!

Codice