Devo staccare gli eventi in jQuery quando rimuovo gli elementi

Question

Ho un'interfaccia utente che utilizza le schede dinamiche, quindi il contenuto può essere caricato in una scheda e quindi la scheda può essere chiusa e il contenuto rimosso dalla pagina.

Quando carico il contenuto in una scheda, allega un sacco di eventi agli elementi che utilizzano jQuery.

Cosa succede quando rimuovo questi elementi dalla pagina? JQuery ha bisogno di sapere?

Inoltre, è importante se allego un evento più volte? Ad esempio, nel caricamento della mia scheda potrei allegare un evento utilizzando un selettore di classe come $('.submitButton').click(...). Ma potrei già avere altre schede aperte, a cui è già stato collegato l'evento submitButton. In questo caso, ricollegherò lo stesso evento. C'è qualche problema con questo?

Answer 1

Se utilizzare i metodi jQuery .remove() o .empty(), puliscono tutti gli eventi (e altri dati) assegnati con jQuery.

• http://api.jquery.com/remove/
• http://api.jquery.com/empty/

Dalla documentazione per remove():

Oltre agli elementi stessi, tutti gli eventi legati ei dati jQuery associati con gli elementi sono stati rimossi

e per vuoto():

Per evitare perdite di memoria, jQuery rimuove altri costrutti quali dati e gestori di eventi dagli elementi secondari prima di rimuovere gli elementi stessi.

Se si sono utilizzati metodi di rimozione API nativi, tutti i dati si bloccheranno. Quindi meglio usare i metodi jQuery.

Answer 2

Se si rimuove un elemento con .remove() tutti gli eventi associati e i dati jQuery associati all'elemento vengono rimossi.

Oltre .detach(), che rimuoverà l'elemento dal DOM, ma mantiene tutti i dati e gli eventi in memoria associata (che è utile se si vuole reinserire l'elemento in un secondo momento)