javascript - prevent - stoppropagation
event.preventDefault() vs. return false(no jQuery) (2)
Mi chiedevo se event.preventDefault()
e return false
fossero uguali.
Ho fatto alcuni test , e sembra che
Se il gestore eventi viene aggiunto utilizzando il modello precedente, ad esempio
elem.onclick = function(){ return false; };
Quindi,
return false
previene l'azione predefinita, comeevent.preventDefault()
.Se il gestore eventi viene aggiunto utilizzando
addEventListener
, ad esempioelem.addEventListener( 'click', function(e){ return false; }, false );
Quindi,
return false
non impedisce l'azione predefinita.
Tutti i browser si comportano in questo modo?
Ci sono più differenze tra event.preventDefault()
e return false
?
Dove posso trovare della documentazione (non potrei in MDN) sul comportamento return false
come event.preventDefault()
in alcuni casi?
La mia domanda riguarda solo javascript, non jQuery, quindi non contrassegnarlo come duplicato di event.preventDefault () o return false , anche se entrambe le domande hanno quasi lo stesso titolo.
Differenza tra preventDefault, stopPropogation, return false
Azione predefinita: azione lato server quando si verifica un evento di controllo.
Supponiamo di avere il controllo div e al suo interno abbiamo un pulsante. Quindi div è il controllo genitore del pulsante. Abbiamo un clic del lato client e un evento di clic sul lato server del pulsante. Inoltre abbiamo l'evento click side del client del div.
Nell'evento click del pulsante sul lato client, possiamo controllare le azioni del controllo parent e del codice lato server utilizzando i tre seguenti modi:
return false
- Questo consente solo l'evento lato client del controllo. L'evento lato server e l'evento lato client del controllo genitore non viene attivato.preventDefault()
: consente l'evento di controllo lato client e il relativo controllo parent. Evento lato server ie. L'azione predefinita del controllo non viene attivata.stopPropogation()
: consente l'aspetto lato client e lato server del controllo. L'evento lato client del controllo non è consentito.
Specifica degli eventi del modello a oggetti del documento W3C in 1.3.1. Le interfacce di registrazione degli eventi affermano che handleEvent
in EventListener non ha valore restituito:
handleEvent
Questo metodo viene chiamato ogni volta che si verifica un evento del tipo per cui è stata registrata l'interfaccia EventListener. [...] Nessun valore di ritorno
sotto 1.2.4. Event Cancelation il documento afferma anche che
L'annullamento si ottiene chiamando il metodo preventDefault dell'Evento. Se uno o più EventListeners chiamano preventDefault durante qualsiasi fase del flusso di eventi, l'azione predefinita verrà annullata.
che dovrebbe scoraggiare l'utente dall'utilizzare qualsiasi effetto che la restituzione di true / false possa avere in qualsiasi browser e utilizzare event.preventDefault()
.
Aggiornare
La specifica HTML5 in realtà specifica come trattare un valore di ritorno diverso. La sezione 6.1.5.1 delle specifiche HTML afferma che
Se il valore restituito è un valore falso booleano WebIDL, quindi annullare l'evento.
per tutto tranne l'evento "mouseover".
Conclusione
Consiglierei comunque di utilizzare event.preventDefault()
nella maggior parte dei progetti poiché sarete compatibili con le vecchie specifiche e quindi con i vecchi browser. Solo se hai solo bisogno di supportare i browser all'avanguardia, restituire false per annullare va bene.