我不明白区别,它们看起来都一样,但我想它们不是。
将不胜感激何时使用其中一个或另一个的任何示例。
e.target
是触发事件调度程序触发的内容,而 e.currentTarget
是您将侦听器分配给的内容。
本的回答是完全正确的——所以请记住他所说的话。我要告诉你的不是完整的解释,但它是一种非常简单的方法来记住 e.target
、e.currentTarget
如何与鼠标事件和显示列表相关:
e.target
= 鼠标下的东西(正如本所说......触发事件的东西)。 e.currentTarget
= 点之前的东西...(见下文)
因此,如果您在剪辑中有 10 个按钮,实例名称为“btns”并且您执行以下操作:
btns.addEventListener(MouseEvent.MOUSE_OVER, onOver);
// btns = the thing before the dot of an addEventListener call
function onOver(e:MouseEvent):void{
trace(e.target.name, e.currentTarget.name);
}
e.target
将是 10 个按钮之一,而 e.currentTarget
将始终是“btns”剪辑。
值得注意的是,如果您将 MouseEvent 更改为 ROLL_OVER 或将属性 btns.mouseChildren
设置为 false,则 e.target
和 e.currentTarget
都将始终为“btns”。
currentTarget
始终是监听事件的对象; target
是接收事件的实际目标。每个事件冒泡,目标接收事件并在显示列表中冒泡。 (或者反过来进行事件捕获)
我喜欢视觉答案。
https://i.stack.imgur.com/pxWr6.png
当您单击 #btn
时,将调用两个事件处理程序并输出您在图片中看到的内容。
此处演示:https://jsfiddle.net/ujhe1key/
e.currentTarget
始终是事件实际绑定的元素。 e.target
是事件源自的元素,因此 e.target
可能是 e.currentTarget
的子元素,或者 e.target
可能是 === e.currentTarget
,具体取决于您的标记的结构。
值得注意的是 event.target 可能很有用,例如,用于使用单个侦听器来触发不同的操作。假设您有一个典型的“菜单”精灵,里面有 10 个按钮,所以不要这样做:
menu.button1.addEventListener(MouseEvent.CLICK, doAction1);
menu.button2.addEventListener(MouseEvent.CLICK, doAction2);
etc...
你可以简单地做:
menu.addEventListener(MouseEvent.CLICK, doAction);
并根据 event.target 触发 doAction(event) 中的不同操作(使用它的 name 属性等...)
target is the element that triggered the event (e.g., the user clicked on)
currenttarget is the element that the event listener is attached to.
举个例子:
var body = document.body,
btn = document.getElementById( 'id' );
body.addEventListener( 'click', function( event ) {
console.log( event.currentTarget === body );
console.log( event.target === btn );
}, false );
当你点击'btn'时,会出现'true'和'true'!
e.currentTarget 将始终返回添加了事件侦听器的组件。
另一方面,e.target 可以是组件本身,也可以是接收事件的任何直系子或孙子或孙子等。换句话说,e.target 返回显示列表层次结构中位于顶部的组件,并且必须在子层次结构或组件本身中。
一种用途是当您在 Canvas 中有多个图像并且您想将图像拖动到组件内但 Canvas 中时。您可以在 Canvas 上添加一个侦听器,并在该侦听器中编写以下代码以确保 Canvas 不会被拖动。
function dragImageOnly(e:MouseEvent):void
{
if(e.target==e.currentTarget)
{
return;
}
else
{
Image(e.target).startDrag();
}
}
e.target 是元素,你可以点击它
e.currentTarget 是添加了事件监听器的元素。
如果单击按钮的子元素,最好使用 currentTarget 来检测按钮属性,在 CH 中使用 e.target 有时会出现问题。
e.currentTarget 是注册事件的元素(父),e.target 是事件指向的节点(子)。