0

有一种奇怪的行为，当我使用命名空间事件时，处理程序总是会被触发。

<div id="div1"></div>
<span id="span1">click</span>
<span id="span2">click</span>


$("#div1").on("click.me", function(event, data){
     $(this).append(data.from);
});

$("#span1").on("click", function(event){
     $("div").trigger("click.me", [{from:"span1"}]);
});

$("#span2").on("click", function(event){
     $("div").trigger("click", [{from:"span2"}]);
});

所以当我点击 span1 和 span2 时，div 会附加数据。这是为什么 ？我不是只添加了特定于“click.me”的处理程序吗？

我在 jsFiddle http://jsfiddle.net/cY5sk/1/上有它

4

1 回答 1

4

我不是只添加了特定于“click.me”的处理程序吗？

不，这不是命名空间的工作方式。处理程序仍然绑定到特定事件，但命名空间为您提供了另一种引用它们的方法。处理程序属于哪个命名空间无关紧要，如果触发事件，则调用该事件的所有处理程序，无论属于哪个命名空间。

考虑：

$("#div1").on("click.me", function(event, data){
     $(this).append(data.from);
});

$("#div1").on("click", function(event, data){
     $(this).append(data.from);
});

$('div').trigger('click.me')只会触发第一个处理程序，因为您指定了me命名空间。但是，$('div').trigger('click')无论它们的命名空间如何，都会触发这两个处理程序。

从文档中：

事件名称可由事件命名空间限定，以简化移除或触发事件。例如，"click.myPlugin.simple"为这个特定的点击事件定义 myPlugin 和 simple 命名空间。

似乎您正在寻找自定义事件，例如

$("#div1").on("foo", function(event, data){
     $(this).append(data.from);
});

$("#span1").on("click", function(event){
     $("div").trigger("foo", [{from:"span1"}]);
});

$("#span2").on("click", function(event){
     $("div").trigger("click", [{from:"span2"}]);
});
于 2013-10-13T02:59:45.370 回答