Как поймать любое событие на элементе?

Question

[Donald_Duck]

Доброго времени суток!
Возможно ли через JS или jQuery отслеживать все события которые вызываются у элемента? Например, кликнули по полу и в консоль вывелись названия событий которые произошли. Или может есть какой-то другой способ?

Comments

[s-jet]

Немного не понятно, что значит все. Если вы кликнули по полу, произошло событие клика по полу) Так-то можно слушать все интересующие вас события и что-то делать при наступлении каждого из них

[Donald_Duck]

s-jet, Я хочу узнать какие события вообще происходят при том или ином действие. Например, какой-то из плагинов взял и навесил свои события. Их я тоже хочу видеть.

[s-jet]

Donald_Duck, х.м. возможно вам помогут в хроме инструменты разработчика и там Elements > Event Listeners

Answer 1

[Егор Живагин]

Тебе для дебага? В хроме же есть Event Listeners у элемента

Comments

[Donald_Duck]

Да, для дебага. Только вот в FF такого нет :(

[Егор Живагин]

Donald_Duck, поставь хром ) Хотя, то, что предложили в ответах тоже интересно и имеет свои плюсы

[Donald_Duck]

Егор Живагин, Он и так стоит. Просто иногда бывает, то что работает в хроме, не работает в FF. Вот и ищешь где накосячил))

Answer 2

[0xD34F]

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

Можно подготовить список типов событий заранее и повесить общий обработчик:

const events = [ 'mousemove', 'mouseleave', 'mousedown', ... ];

$element.on(events.join(' '), function(e) { ... })

Или попробовать собрать имена типов событий, перебирая DOM-свойства элемента - имена обработчиков выглядят как "on<тип события>":

const events = [];
for (const k in element) {
  if (k.indexOf('on') === 0) {
    events.push(k.slice(2));
  }
}

$(element).on(events.join(' '), function(e) {
  console.log(e.type);
});

Comments

[Donald_Duck]

Спасибо

Answer 3

[panterr92]

есть тег onclick, который может вызывать нужную функцию в коде JS

Comments

[Donald_Duck]

Я клик привел только для примера. Я же хочу отследить любое событие, например, подключил какой-то плагин jQuery, и теперь вот хочу отслеживать все события которые отрабатывают на элементе.

[panterr92]

ниже отписались более детально

Answer 4

[Павел Корнилов]

el.onclick= el.oncontextmenu= el.onmouseover= eRouter;

function eRouter(e) {
			if(e.type === 'click') {
				...
			} else if(e.type === 'contextmenu') {
				...
			} else if(e.type === 'mouseover') {
...
}

		}

Таким образом можно из одной функции проверять какое из событий произошло и что-то предпринимать по этому поводу.