调度名称中带有点的 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

"normal"DOM事件系统没有名称空间的概念。 window.addEventListener('test.namespace', ...) 将真正监听名称为 test.namespace 的事件，这就是您使用 new CustomEvent('test.namespace', ...).

创建的事件

Event namespaces是jQuery中的一个概念：

An event name can be qualified by event namespaces that simplify removing or triggering the event. For example, "click.myPlugin.simple" defines both the myPlugin and simple namespaces for this particular click event. A click event handler attached via that string could be removed with .off("click.myPlugin") or .off("click.simple") without disturbing other click handlers attached to the elements.

这里重要的是命名空间不是事件名称的一部分。这就是为什么 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 的事件安装处理程序。

调度名称中带有点的 CustomEvent 不会触发 jQuery.on() 事件侦听器

Dispatching CustomEvent with dot in name do not trigger jQuery.on() event listener

javascript

jquery

namespaces

custom-events

jquery-events