Отправка CustomEvent с точкой в ​​имени не вызывает слушатель события jQuery.on()

Question

Я использовал jQuery версии 2.2.4 и попытался захватить событие - не повезло. Есть ли способ исправить проблему?

Этот код работает:

window.addEventListener('test.namespace', e => console.log('CustomEvent with namespace captured by vanilla'));

Это не работает:

$(window).on('test.namespace', e => console.log('CustomEvent with namespace captured by jQuery'));

const event = new CustomEvent('test.namespace', {
  bubbles: true,
  detail: 123
});
window.dispatchEvent(event);

http://jsbin.com/tecupavuji/edit?html,js,console

Answer 1

У "нормальной" системы событий DOM нет концепции пространств имен. window.addEventListener('test.namespace', ...) будет буквально слушать событие с именем test.namespace, который вы создаете new CustomEvent('test.namespace', ...),

Пространства имен событий - это концепция в jQuery:

Имя события может быть дополнено пространствами имен событий, которые упрощают удаление или запуск события. Например, "click.myPlugin.simple" определяет как myPlugin, так и простые пространства имен для этого конкретного события click. Обработчик события щелчка, прикрепленный через эту строку, может быть удален с помощью .off("click.myPlugin") или же .off("click.simple") не мешая другим обработчикам щелчков, прикрепленным к элементам.

Здесь важно то, что пространство имен не является частью имени события. Вот почему new CustomEvent('test.namespace', ...) не работает, но new CustomEvent('test', ...) было бы.

Если вы хотите вызвать событие для определенного пространства имен, вы должны использовать для этого jQuery:

$(window).trigger('test.namespace', {detail: 123});

$(window).on('test.namespace', e => console.log('CustomEvent with namespace captured by jQuery'));

$(window).trigger('test.namespace', {detail: 123});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

Предыдущий ответ на самом деле не решает проблему того, как зарегистрировать обработчик для настраиваемого события, которое поступает из сторонней (не jQuery) библиотеки и имеет точку в имени события. Скажите, что событиеfoo.bar.

Короткий ответ заключается в том, что в jQuery нет способа установить обработчик для такого события.

$(window).on( 'foo.bar' ) вместо этого установит обработчик для события foo.

Кажется, нет никакого способа избежать точки в имени или иным образом заставить jQuery установить обработчик для события с именем foo.bar.