Javascript: Controlar el orden en que los manipuladores/oyentes de eventos se ejecutan en

Question

Una vez más, el IE Monster me ha golpeado con un problema extraño.

Estoy escribiendo algunos cambios en un sitio asp.net que heredé hace un tiempo. Uno de los problemas es que en algunas páginas hay varios controles que agregan funciones de JavaScript como controladores al evento de carga (usando YUI si eso es importante). Algunos de esos controladores de eventos suponen que se han ejecutado ciertas otras funciones.

Esto está muy bien en Firefox e IE7 ya que los controladores parecen ejecutarse en orden de registro. IE8 por otro lado hace esto al revés.

Podría ir con algún tipo de enfoque de doble verificación, pero dado que los controles están presentes en varias páginas, creo que crearía aún más dependencias. Así que comencé a cocinar mi propia clase de cola a la que presiono las funciones y puedo controlar su orden de ejecución. Luego registraré un controlador de carga que ordena a la cola que se ejecute en mi orden preferido.

estoy en mitad del proceso que han iniciado y preguntándose 2 cosas:

1. ¿Voy OTT?
2. ¿Estoy reinventando la rueda?

¿Alguien tiene alguna idea? ¿Alguna solución limpia que me permita aplicar fácilmente el orden de ejecución?

Answer 1

No pude encontrar ningún estándar que definiera el orden de las llamadas de los eventos. Este no es un problema esto es pura anarquía : D

También hay cientos de implementaciones independientes de este patrón, por lo que es poco probable que se comportarían de manera coherente en el corto plazo.

Así que sí, estás solo.

El enfoque más limpio y más compatible que tengo, implica el registro de solo un controlador de eventos: D De esta manera, el orden nativo se vuelve irrelevante.

Ahora el truco consiste en agregar su propia administración de eventos predecible además de eso, utilizando una biblioteca, que se extiende con la versión de nodeJS, por ejemplo, según sus requisitos.

Nota que JS le da la libertad para simplemente reemplazar las funciones del prototipo derivado, por lo que otra posibilidad es algo como esto:

function eventify(element){ 
    element._event = {} 
    element.on = element.addListener = function(evt,fn){ ... } 
    element.off = element.removeListener = function(evt,fn){ ... } 
    element.emit function(evt,args...){ ... do it the right way ... } 
} 

Así que tal vez es un poco fuera de la pista en la que consideran las colas y de bloqueo -mechanisms :)