Precedencia de evento DOM
-
08-07-2019 - |
Pregunta
¿Qué orden de precedencia se manejan los eventos en JavaScript?
Aquí están los eventos en orden alfabético ...
- onabort - La carga de una imagen es interrumpido
- onblur - Un elemento pierde foco
- onchange - El usuario cambia el contenido de un campo
- onclick - El mouse hace clic en un objeto
- ondblclick: el mouse hace doble clic en objeto
- onerror: se produce un error cuando cargar un documento o una imagen
- onfocus - Un elemento obtiene foco
- onkeydown: una tecla del teclado es presionado
- onkeypress - Una tecla del teclado es presionado o presionado
- onkeyup: una tecla del teclado es lanzado
- onload: una página o una imagen es terminado de cargar
- onmousedown - Un botón del mouse es presionado
- onmousemove - El mouse se mueve
- onmouseout: el mouse se mueve un elemento
- onmouseover - El mouse se mueve sobre un elemento
- onmouseup - Un botón del mouse es lanzado
- onreset - El botón de reinicio está hecho clic
- onresize: una ventana o marco es redimensionado
- onselect - El texto está seleccionado
- onsubmit - El botón de enviar es hecho clic
- onunload - El usuario sale de la página
¿En qué orden se manejan fuera de la cola de eventos?
La precedencia no es primero en entrar, primero en salir (FIFO) o eso creo.
Solución
Esto no fue, hasta donde yo sé, explícitamente definido en el pasado. Los diferentes navegadores son libres de implementar la ordenación de eventos como mejor les parezca. Si bien la mayoría están lo suficientemente cerca para todos los fines prácticos, ha habido y sigue habiendo algunos casos extraños en los que los navegadores difieren un poco (y, por supuesto, muchos más casos en los que ciertos navegadores no pueden enviar ciertos eventos en absoluto ).
Dicho esto, el HTML 5 borrador de recomendación intenta especificar cómo los eventos se pondrán en cola y se enviarán - el bucle de eventos :
Para coordinar eventos, usuario interacción, guiones, renderizado, redes, etc., agentes de usuario debe usar bucles de eventos como se describe en esta sección.
Debe haber al menos un bucle de evento por agente de usuario, y como máximo un evento bucle por unidad de relacionados contextos de navegación de origen similar.
Un bucle de evento tiene una o más tareas colas Una cola de tareas es un pedido lista de tareas [...] Cuando un agente de usuario debe poner en cola una tarea, debe agregar la tarea dada a una de las colas de tareas del evento relevante lazo. Todas las tareas de uno fuente de tarea particular siempre debe ser agregado a la misma cola de tareas, pero tareas de diferentes fuentes de tareas pueden ser colocado en diferentes colas de tareas. [...]
[...] un agente de usuario podría tener una cola de tareas para eventos clave y de mouse (el usuario fuente de tarea de interacción), y otra por todo lo demás El agente de usuario entonces podría dar teclado y mouse preferencia de eventos sobre otras tareas tres cuartos del tiempo, manteniendo la interfaz responde pero no morir de hambre a otras colas de tareas, y nunca procesamiento de eventos de cualquier tarea fuente fuera de servicio. [...]
Tenga en cuenta que el último bit: depende de la implementación del navegador determinar qué eventos se agruparán y procesarán en orden, así como la prioridad dada a cualquier tipo particular de evento. Por lo tanto, hay pocas razones para esperar que todos los navegadores envíen todos eventos en un orden fijo, ahora o en el futuro.
Otros consejos
Para cualquiera que desee saber la secuencia en la que se llama a los eventos relativos, consulte a continuación. Hasta ahora solo he probado en Chrome.
- mouseover
- mousemove
- mouseout
- mousedown
- cambio (en entrada enfocada)
- desenfoque (en elemento enfocado)
- foco
- mouseup
- clic
- dblclick
- keydown
- pulsación de tecla
- keyup
Si está viendo eventos de mouse / touch, Patrick H. Lauke ha publicado una charla sobre el tema . Definitivamente una lectura interesante & # 8211; y se ocupa de todas las peculiaridades de diferentes navegadores, diferentes dispositivos y diferentes estándares.
También incluye un conjunto completo de pruebas .