2012-06-22 26 views
6

Tenemos una aplicación web muy intensivo en JS, en gran parte en torno a live fijaciones de jQuery (de hecho hemos estado haciendo esto desde antes de jQuery v1.7).jQuery evento de depuración en Chrome

Chrome incorpora en herramientas dev son grandes, sin embargo, hay un problema que se presentan siempre que siempre encuentro casi imposible depurar con ellos: veces mis live manipuladores no son llamados debido a un controlador anterior detener la propagación de eventos.

¿Hay alguna manera de hacer que Chrome (o, de hecho Firebug u otra extensión o bookmarklet (preferiblemente libre!)) A descanso en el próximo controlador de eventos fuera del código de la librería jQuery. De esta manera, simplemente podría hacer clic en el botón y ver qué evento está disparando, pasar y ver cuándo estoy deteniendo accidentalmente la propagación.

Si no, ¿hay una buena razón por la que no? Se puede hacer esto?

Respuesta

3

En los DevTools Chrome se puede establecer un punto de interrupción por tipo de evento:

https://developers.google.com/chrome-developer-tools/docs/scripts-breakpoints#listeners

No se puede excluir eventos de jQuery sin embargo.

Por cierto que debe utilizar delegate en lugar de en vivo()

+0

He intentado esto y estoy luchando. Esto solo ingresará en el código de la biblioteca jQuery. Parece que no puedo encontrar la parte de la biblioteca jQuery que llama (o aplica) las funciones de evento que le das. No creo que haya ningún beneficio de cambiar a 'delegar' ya que todos necesitarían estar en la parte superior del árbol DOM (quizás muy pocos no lo harían). Además, ambas funciones ahora están en desuso. Cuando tengamos tiempo, nos mudaremos a ['on'] (http://api.jquery.com/on/) – Connell

+0

delegado ha quedado en desuso, ha sido reemplazado por" on " –

+0

ya que este hilo fue escrito el equipo DevTools también introdujo la capacidad de los guiones de blackbox, lo que realmente ayuda con cosas como esta. Ver https://developer.chrome.com/devtools/docs/blackboxing – Thomas

7

Usted puede encontrar esto útil: http://www.sprymedia.co.uk/article/Visual+Event+2

Javascript bookmarklet llamado Visual Evento que muestra visualmente los elementos de una página que han eventos suscritos a ellas , cuáles son esos eventos y la función que ejecutaría el evento cuando se activa ...

Resulta que no existe un método estándar proporcionado por la interfaz DOM recomendada por W3C para averiguar qué eventos oyentes están e adjuntado a un nodo particular ... Como tal, nos vemos obligados a examinar las bibliotecas Javascript individuales, que suelen mantener un caché de eventos adjuntos (para que luego puedan eliminarse y realizar otras abstracciones útiles).

1

Además de la respuesta de DG, este es el Chrome Extension de Visual Event. Funciona perfectamente

Cuestiones relacionadas