Precedenza dell'evento DOM
-
08-07-2019 - |
Domanda
Quale ordine di precedenza sono gli eventi gestiti in JavaScript?
Ecco gli eventi in ordine alfabetico ...
- onabort - Il caricamento di un'immagine è interrotta ??li>
- onblur - Un elemento perde lo stato attivo
- onchange - L'utente cambia il contenuto di un campo
- onclick: il mouse fa clic su un oggetto
- ondblclick - Il mouse fa doppio clic su un oggetto
- onerror - Si verifica un errore quando caricamento di un documento o di un'immagine
- onfocus - Un elemento ottiene lo stato attivo
- onkeydown - Un tasto della tastiera è premuto
- onkeypress - Un tasto della tastiera è premuto o tenuto premuto
- onkeyup: un tasto della tastiera è rilasciato
- onload - Una pagina o un'immagine è caricamento completato
- onmousedown - Un pulsante del mouse è premuto
- onmousemove - Il mouse viene spostato
- onmouseout - Il mouse viene spostato un elemento
- onmouseover - Il mouse viene spostato sopra un elemento
- onmouseup - Un pulsante del mouse è rilasciato
- onreset: il pulsante di ripristino è cliccato
- onresize - Una finestra o cornice è ridimensionato
- onselect - Il testo è selezionato
- onsubmit - Il pulsante di invio è cliccato
- onunload: l'utente esce dalla pagina
Quale ordine vengono gestiti dalla coda degli eventi?
La precedenza non è first-in-first-out (FIFO) o almeno così credo.
Soluzione
Questo, per quanto ne so, non è stato definito esplicitamente in passato. Browser diversi sono liberi di implementare l'ordinamento degli eventi come preferiscono. Mentre la maggior parte sono abbastanza vicini per tutti gli scopi pratici, ci sono stati e continuano ad esserci alcuni casi limite strani in cui i browser differiscono in qualche modo (e, naturalmente, i molti altri casi in cui alcuni browser non riescono a inviare determinati eventi affatto ).
Detto questo, la bozza di raccomandazione HTML 5 tenta di specificare come verranno messi in coda e inviati gli eventi - il ciclo degli eventi :
Per coordinare eventi, utente interazione, script, rendering, rete e così via, agenti utente deve utilizzare loop di eventi come descritto in questa sezione.
Deve esserci almeno un loop di eventi per agente utente e al massimo un evento loop per unità di correlati contesti di navigazione di origine simile.
Un ciclo di eventi ha una o più attività code. Una coda di attività è ordinata elenco delle attività [...] Quando un agente utente deve mettere in coda un'attività, deve aggiungere l'attività specificata a una delle le code delle attività dell'evento rilevante ciclo continuo. Tutti i compiti da uno la fonte di attività particolare deve essere sempre aggiunto alla stessa coda di attività, ma attività da diverse fonti di attività possono essere collocato in diverse code di attività. [...]
[...] un agente utente potrebbe avere una coda di attività per eventi del mouse e dei tasti (l'utente sorgente dell'attività di interazione) e un'altra per tutto il resto. L'agente utente potrebbe quindi dare tastiera e mouse preferenza eventi rispetto ad altre attività tre quarti del tempo, mantenendo l'interfaccia è reattiva ma non morire di fame altre code di attività e mai elaborazione di eventi da qualsiasi attività fonte fuori servizio. [...]
Nota l'ultimo bit: spetta all'implementazione del browser determinare quali eventi verranno raggruppati ed elaborati in ordine, nonché la priorità data a qualsiasi tipo particolare di evento. Pertanto, ci sono poche ragioni per aspettarsi che tutti i browser invino tutti gli eventi in un ordine fisso, ora o in futuro.
Altri suggerimenti
Per chiunque desideri conoscere la sequenza in cui vengono chiamati gli eventi relativi, vedere di seguito. Finora ho provato solo in Chrome.
- passaggio del mouse
- mousemove
- mouseout
- mousedown
- modifica (su input focalizzato)
- sfocatura (sull'elemento focalizzato)
- focus
- mouseup
- fai clic
- dblclick
- keydown
- pressione del tasto
- keyup
Se stai osservando eventi mouse / touch, Patrick H. Lauke ha pubblicato un discorso sull'argomento . Sicuramente una lettura interessante - e affronta tutte le stranezze di diversi browser, dispositivi diversi e standard diversi.
Raggruppa anche un set completo di test .