命名空间自定义事件触发器

Question

我对命名空间自定义事件应该如何在 jQuery 中工作感到困惑。我从the doc 得到的印象是，触发命名空间自定义事件只会触发专门绑定到该事件的处理程序。相反，似乎命名空间几乎被忽略了。下面的示例和此处的实时代码：http://jsfiddle.net/kZCBw/1/

    $(document)
        .bind("reset.one", function(){ console.log("reset.one event detected");})
        .bind("reset.two", function(){ console.log("reset.two event detected");})
        .bind("cheese", function(){ console.log("cheese event detected");});

        $("#btn1").click(function(){
            console.log("firing reset.one event");
            $(this).trigger("reset.one");
        });
        $("#btn2").click(function(){
            console.log("firing reset.two event");
            $(this).trigger("reset.two");
        });
        $("#btn3").click(function(){
            console.log("firing reset event");
            $(this).trigger("reset");
        });

        //btn1 click should only trigger handlers bound to "reset.one"
        //and yet it triggers anything starting w/ "reset"

我错过了什么？

提前致谢！ -马特

Answer 1

我至少可以证实你的例子并添加一个观察结果。

如果您将按钮设为监听器（请参阅 http://jsfiddle.net/kZCBw/2/），更好地反映文档中的示例代码，它会按预期工作。

但如果你将它移到 DOM 树中更高的位置（参见 http://jsfiddle.net/kZCBw/3/），它就会失败。

起初，我怀疑这是因为命名空间没有被事件对象冒泡，但我附加了以下代码（http://jsfiddle.net/kZCBw/4/ 的实时示例）：

$('*').bind('reset', function(e){
    console.log(e.type + '.' + e.namespace + ' detected at ' + e.currentTarget);
});

如您所见，命名空间正在冒泡。

虽然您正在寻找的行为（命名空间在更高级别的 DOM 节点上保持有效）没有在 documentation 中明确举例说明，但我认为它应该是命名空间事件的工作方式。至此，您现在可以开始寻找“错误或功能”了。

在不接触 jQuery 源代码的情况下完成您正在寻找的事情的一种临时方法是在事件处理程序中使用 EventObject 过滤事件（我怀疑这是首先在 jQuery 中完成命名空间事件的方式） .