Priorité des événements DOM

Question

Quel est l'ordre de priorité des événements gérés en JavaScript?

Voici les événements par ordre alphabétique ...

1. onabort - Le chargement d'une image est interrompu
2. onblur - Un élément perd le focus
3. onchange - L'utilisateur modifie le contenu d'un champ
4. onclick - Clics de souris sur un objet
5. ondblclick - La souris double-clique sur un objet
6. onerror - Une erreur se produit lorsque chargement d'un document ou d'une image
7. onfocus - Un élément obtient le focus
8. onkeydown - Une touche du clavier est pressé
9. onkeypress - Une touche du clavier est enfoncé ou maintenu enfoncé
10. onkeyup - Une touche du clavier est  publié
11. onload - Une page ou une image est  chargement terminé
12. onmousedown - Un bouton de la souris est  pressé
13. onmousemove - La souris est déplacée
14. onmouseout - La souris est déplacée  un élément
15. onmouseover - La souris est déplacée  sur un élément
16. onmouseup - Un bouton de souris est  publié
17. onreset - Le bouton de réinitialisation est  cliqué sur
18. onresize - Une fenêtre ou un cadre est  redimensionné
19. onselect - le texte est sélectionné
20. onsubmit - Le bouton d'envoi est  cliqué sur
21. onunload - l'utilisateur quitte la page

Quel ordre sont-ils traités en dehors de la file d'attente des événements?

La priorité n'est pas premier entré, premier sorti (FIFO) ou du moins je le crois.

Answer 1

Pour autant que je sache, ce n’était pas explicitement défini par le passé. Différents navigateurs sont libres d’implémenter la commande d’événements à leur convenance. Bien que la plupart soient suffisamment proches pour des raisons pratiques, il existe encore et toujours des cas étranges où les navigateurs diffèrent quelque peu (et, bien sûr, beaucoup plus de cas où certains navigateurs ne parviennent pas à envoyer certains événements du tout ).

Cela dit, le projet de recommandation HTML 5 tente de spécifier comment les événements seront mis en file d'attente et distribués - la boucle d'événements :

  

Pour coordonner les événements, l'utilisateur   interaction, scripts, rendu,   la mise en réseau, etc., les agents utilisateurs   doit utiliser des boucles d'événement comme décrit dans   cette section.

     

Il doit y avoir au moins une boucle d'événement   par agent d'utilisateur et au plus un événement   boucle par unité de connexe   contextes de navigation d'origine similaire.

     

Une boucle d'événement a une ou plusieurs tâches.   les files d'attente. Une file d'attente est une commande   liste des tâches [...]   Lorsqu'un agent utilisateur doit mettre une tâche en file d'attente,   il doit ajouter la tâche donnée à l'un des   les files d'attente de tâches de l'événement concerné   boucle. Toutes les tâches d'un   source de tâche particulière doit toujours être   ajouté à la même file d'attente de tâches, mais   tâches de différentes sources de tâches peuvent   être placé dans différentes files d'attente.   [...]

     

[...] un agent d'utilisateur peut avoir une file d'attente de tâches   pour la souris et les événements clés (l'utilisateur   la source de la tâche d’interaction), et une autre   pour tout le reste. L'agent utilisateur   pourrait alors donner le clavier et la souris   préférence des événements par rapport à d'autres tâches   les trois quarts du temps, en gardant   l'interface sensible mais pas   affamer d'autres files d'attente de tâches, et jamais   traitement des événements d'une tâche quelconque   source en panne. [...]

Notez ce dernier bit: il appartient au navigateur de déterminer les événements qui seront regroupés et traités dans l’ordre, ainsi que la priorité donnée à un type d’événement particulier. Par conséquent, il est peu probable que tous les navigateurs envoient tous tous les événements dans un ordre fixe, maintenant ou à l'avenir.

Answer 2

Pour ceux qui souhaitent connaître la séquence, les événements relatifs sont appelés, voir ci-dessous. Jusqu'à présent, je n'ai testé que sur Chrome.

1. survolez
2. déplacez la souris
3. mouseout

1. mousedown
2. changer (sur l'entrée ciblée)
3. flou (sur l'élément ciblé)
4. focus
5. mouseup
6. cliquez sur
7. dblclick

1. keydown
2. appuyez sur la touche
3. keyup

Answer 3

Si vous regardez les événements touchant la souris ou le toucher, Patrick H. Lauke a publié un conférence. sur le sujet . Certainement une lecture intéressante - et traite de toutes les bizarreries de différents navigateurs, de différents appareils et de différentes normes.

Il regroupe également un ensemble complet de tests .