Существуют ли инструменты/методы для отладки обработчиков событий jQuery?

В настоящее время я пытаюсь выяснить, какие обработчики событий click привязаны к моему div. Там должен быть только один обработчик, но, похоже, по крайней мере один. Я использую FireBug, но Chrome тоже может быть вариантом. Мне не нравится IE, поэтому я бы предпочел не использовать это.

В лучшем случае я могу проверить свой div с помощью FireBug и посмотреть список обработчиков событий.

Ответы

Ответ 1

Визуальное событие - это хорошая закладка javascript, которую вы можете запустить на странице, чтобы увидеть все события, связанные с элементом управления.

Ответ 2

Если вы используете jQuery для назначения обработчиков событий, вы можете найти прикрепленные события через $("div").data("events");

$("div.test").each(function(){
    var events = $(this).data("events");
    //events.click will give you a list of click handlers, events.mouseenter, etc..
    $.each(events, function(i, eventType){
        $.each(eventType, function(){
          //this.handler() can be used to find the anonymous function assigned to the element.
          $("body").append("<h1>" + this.type + "</h1>");
        });
    });
});

Если вы хотите получить живые обработчики, вы можете сделать то же самое для документа.

var liveEvents = $(document).data("events").live;
$.each(liveEvents, function() {
    $("body").append("<h1>" + this.selector + this.origType +  "</h1>");
});

Пример jsfiddle.

Ответ 3

Установите плагин fireQuery для firebug, и вы увидите все события, связанные с jQuery, на дисплее Firebug, как хотите;)

Вы можете найти его здесь: http://firequery.binaryage.com/ или здесь: https://addons.mozilla.org/en-us/firefox/addon/firequery/

Это сделает ваш firebug похожим на это:

Ответ 4

Проверьте функцию $.data.

В частности, что-то вроде этого:

var clicks = $(mySelector).data('events'). click;

Должен возвращать список обработчиков событий кликов и связанных с ними объектов DOM.

Ответ 5

"fire-bug" Дополнения (для mozilla) - лучший вариант для этого.