Eventi e Listener
Logic bug: $('.btn').click() does not trigger on elements injected into DOM after initial page load – jQuery EVENT_DYNAMIC_ELEMENTS_FAIL
Associare eventi direttamente con '$(".btn").on("click", ...)' collega il listener solo ai nodi DOM già esistenti al momento dell'esecuzione; per elementi aggiunti successivamente tramite AJAX occorre usare la delegazione: '$(document).on("click", ".btn", ...)'.
Cosa significa questo errore?
Associare eventi direttamente con '$(".btn").on("click", ...)' collega il listener solo ai nodi DOM già esistenti al momento dell'esecuzione; per elementi aggiunti successivamente tramite AJAX occorre usare la delegazione: '$(document).on("click", ".btn", ...)'.
Messaggio originale
Logic bug: $('.btn').click() does not trigger on elements injected into DOM after initial page loadContesto e parole chiave
Alias
- jQuery click not working on dynamic elements
Messaggi alternativi
- evento click non scatta su elementi aggiunti dinamicamente
Prodotti
- jQuery Library (v1.x, v2.x, v3.x, v4.x)
Piattaforme
- Linux
- macOS
- Qualsiasi Browser Web
- Windows
Parole chiave
- ajax
- errore-jquery-on-click-dynamic-elements-not-working
- Eventi e Listener
- javascript
- jquery
- jquery.eventi.on-click-not-working-on-dynamically-added-elements
Cause possibili
Causa tecnica per Errore jQuery: Event Listener Non Funziona su Elementi Generati Dinamicamente
Associare eventi direttamente con '$(".btn").on("click", ...)' collega il listener solo ai nodi DOM già esistenti al momento dell'esecuzione; per elementi aggiunti successivamente tramite AJAX occorre usare la delegazione: '$(document).on("click", ".btn", ...)'.
molto comuneDiagnosi
Diagnostica DOM o AJAX per Errore jQuery: Event Listener Non Funziona su Elementi Generati Dinamicamente
Verificare lo stato della variabile window.jQuery nella Console DevTools (F12) e ispezionare il tab Network per le chiamate AJAX.
Come leggere il risultato. Restituisce la versione attiva di jQuery e il numero effettivo di nodi DOM corrispondenti al selettore.
console.log(jQuery.fn.jquery); console.log($('.my-element').length);Risoluzione
Risoluzione standard per Errore jQuery: Event Listener Non Funziona su Elementi Generati Dinamicamente
Applicare la correzione al codice o alla configurazione degli script jQuery nel frontend.
- Ispezionare la riga segnalata nella console del browser
- Correggere il selettore CSS, il passaggio dei parametri o la delegazione con .on()
- Ricaricare la pagina con cache svuotata (Ctrl+F5) per verificare la risoluzione
Domande frequenti
Come risolvere l'errore Errore jQuery: Event Listener Non Funziona su Elementi Generati Dinamicamente in jQuery?
Associare eventi direttamente con '$(".btn").on("click", ...)' collega il listener solo ai nodi DOM già esistenti al momento dell'esecuzione; per elementi aggiunti successivamente tramite AJAX occorre usare la delegazione: '$(document).on("click", ".btn", ...)'.
Approfondimenti
- jQuery API Documentation / jQuery Core Issues documentazione_ufficiale