Metodo per risolvere il problema di eventi come click non attivati per elementi DOM

Ho sempre avuto problemi con gli elementi generati dai plugin js, gli eventi click non funzionano, nemmeno se li riabboni, alla fine ho trovato una soluzione, lo scrivo qui.

Mentre approfondisci la comprensione del meccanismo di gestione degli eventi js.

1. Evento disconnesso

In questo caso, di solito non provoca il fallimento del click, ma in alcune circostanze, l'evento click non funziona:

$(function(){
 $('.btn').unbind()
)
$('.btn').click(function(){
 //...
 )

Quindi, abituati bene all'evento click:

$(function(){
 $('.btn').click(function(){
 //...
 )
) 

2. Caricamento asincrono/dinamico di dom tramite plugin js

Di solito contiene un tempo di attesa/inizio dell'esecuzione: WaitTime

In questo momento, il binding/监听直接 non funziona:

$(function(){
 $('.container .btn').on('click',function(){
 //...
 )
) 

Soluzione 1:

$(function(){
 setTimeout(function{ 
 $('.container .btn').click(function(){
  //...
  )
 //.btn caricato dopo l'evento 
 },WaitTime) 
) 

Soluzione 2 (Delegation degli eventi, ovvero delegare agli elementi genitori):

$(function(){
 $('.container').on('click','.btn',function(){
 //...
 )
) 

3. Caricamento DOM asincrono ajax

• Puoi aggiungere l'evento click nel corpo della funzione done()
• Come nel metodo di delegation degli eventi di n. 2.

4. Non c'è reazione al clic del link

Il seguente codice farà sì che l'etichetta a abbia href ma non possa saltare

$(function(){
 $('a').on('click',function(e){
 e.preventDefault()
 //...
 )
) 

Soluzione:

$(function(){
 $('a').on('click',function(e){
 e.preventDefault()
 //...
 )
 $('a').unbind()
)

Conclusione

1. Binding degli eventi, Listening degli eventi, Delegation degli eventi - Link correlati

2. Cattura degli eventi e Bubbling - Link correlati

 target.addEventListener(type, listener[, options]);
 target.addEventListener(type, listener[, useCapture]);

Cattura degli eventi

Il padre di un elemento si verifica prima, il figlio di un elemento si verifica dopo

Bubbling degli eventi

Il figlio di un elemento si verifica prima, il padre di un elemento si verifica dopo

3. ordine di esecuzione javascript

Questo è tutto il contenuto dell'articolo, speriamo che il contenuto di questo articolo possa aiutare un po' la tua apprendimento o lavoro, e speriamo anche di ricevere molta più supporto per il tutorial di urla!

Dichiarazione: il contenuto di questo articolo è stato tratto da Internet, il copyright spetta ai rispettivi autori, il contenuto è stato contribuito e caricato autonomamente dagli utenti di Internet, questo sito non detiene i diritti di proprietà, non è stato editato manualmente e non assume alcuna responsabilità legale. Se trovi contenuti sospetti di violazione del copyright, ti preghiamo di inviare una e-mail a: notice#oldtoolbag.com (al momento dell'invio dell'e-mail, sostituisci # con @) per segnalare il problema e fornire prove pertinenti. Una volta verificata, questo sito eliminerà immediatamente il contenuto sospetto di violazione del copyright.