jquery - $.event.trigger 不适用于 DOM 元素

Question

根据我的阅读，这应该有效......

$('#test').on "newMessage", ->
  alert('test')

$(document).on "newMessage", ->
  alert('document')

$.event.trigger('newMessage')

例如http://jsfiddle.net/Nbdyb/

有人可以帮我理解为什么我从来没有收到“测试”警报吗？

Answer 1

您newMessage在元素中注册了一个处理程序#test，以便触发应该在该元素或其后继者之一中触发事件（事件冒泡）。

它应该是

$('#test').trigger('newMessage')

Answer 2

由于 $.event 没有正式记录，我将当前源代码与一些旧版本的 jQuery 进行了比较，并找到了一个关于删除此“功能”的 TODO。至少它解释了为什么它不再起作用了。

这是用于允许它工作的代码块。

https://github.com/jquery/jquery/blob/1.6.2/src/event.js#L322-335

如果没有传入任何元素，则当前代码现在只是指定document为元素。这就是它对文档和窗口工作正常的原因。

看起来如果我想要匿名 pupsub，我将需要一个单独的库......

Answer 3

当我jquery从v1.7.1升级到v1.11.1 + 时，我发现$.event.trigger()它不再起作用了。

仍然不知道为什么，但这是事件驱动操作（不是基于 DOM 的事件处理）的替代解决方案：

---

过去 ：

// handler
$(anyElement).on('Foo:SelfDefined:Event', function(event){
    console.log( event.self_data_1 );
    console.log( event.self_data_2 );
});
------------------
// trigger handler
var evOpts = {
    type        : 'Foo:SelfDefined:Event',
    self_data_1 : 'foo',
    self_data_2 : 'bar'
};
$.event.trigger( evOpts );

现在 ：

// handler
$(document).on('Foo:SelfDefined:Event', function(event, evData){
    console.log( evData.self_data_1 );
    console.log( evData.self_data_2 );
});
------------------
// trigger handler
var evData = {
    type        : 'Foo:SelfDefined:Event',
    self_data_1 : 'foo',
    self_data_2 : 'bar'
};
$(document).trigger(evData.type, evData);

注意：如果元素 A 触发了一个事件，只有它的父节点或者它自己可以监听该事件并将处理程序附加到该事件，这就是为什么这个解决方案不适合基于 DOM 的事件处理。