Реально ли с помощью инспектора найти место где на элемент вешается событие средствами JQuery?

Question

[vis0r]

Довольно часто бывает необходимо в чужом коде обнаружить место в котором на элемент DOM вешается событие средствами JQuery. Но в большинстве случаев, кода бывает огромное множество, и разбросан он по разным файлам. В фаерфоксе к примеру можно в дереве DOM увидеть что на элементе висит какое либо событие, и даже увидеть функцию внутри JQuery на нативном JS которая это событие повесила. Однако найти сам источник бывает не так то просто.

Вопрос скорее практический: какие существуют (если существуют вообще) способы найти данный кусок кода без особых заморочек?

Answer 1

[Алексей Зуев]

У jquery есть хороший метод

$._data(element, "events")

С помощью него можно находить события, повешенные на элемент



Еще есть небольшой скрипт-обертка, использующий этот метод (ссылка на гитхаб). Благодаря скрипту можно искать события по селектору, а не по одному элементу.
Метод описывается в статье Quickly finding and debugging jQuery event handler...


Делаем клик правой кнопкой мыши на строке handler и попадаем в место, где навешивалось событие.

Answer 2

[Dmitriy Mozgovoy]

Ну если по простому текстовому поиску ничего в firebug'e не выдает, то можно в версии JQ для разработчиков поставить точку останова в функции jQuery.event.add c условием, где elem фильтруется по какому либо его свойству...

Answer 3

[Александр Маджугин]

В Dragonfly в стайрой Опере (в настоящей ещё) показывало рядом с элементом значок события и там как-то можно было докапаться до места где навешивается. Было удобно. Вообще Dragonfly был очень удобен сам по себе.
Теперь в хромоотладчике только через поиск по предполагаемому селектору: joxi.ru/LmGpqbPfOE742l

Comments

[Евгений Петров]

В Firefox такое есть в нативном инспекторе. В настоящем браузере Firefox.

[Александр Маджугин]

Евгений Петров: там же вроде показывается именно слушатель - т.е. ссылка придется на кусок кода в jquery. Нет?

[Евгений Петров]

Александр Маджугин: При нажатии на значок развернётся список обработчиков с адресами скриптов. Кликнув на обработчике, тут же видим его код.

Answer 4

[Алексей]

Недавно для себя открыл jQuery Audit (https://chrome.google.com/webstore/detail/jquery-a...)

После установки искать здесь:

Comments

[vis0r]

А эта штука позволит таким же образом отследить допустим место где на элемент был накинут некий jQuery плагин например?

Например имеется див контейнер с картинками на который накинут слайдер/галерея. И вот было бы удобно видеть место где цепляется плагин.