나는 그 차이를 이해하지 못한다. 둘 다 동일하게 보이지만 그렇지 않다고 생각한다.
어느 쪽을 사용할 것인지에 대한 모든 예가 이해 될 것이다.
답변
벤은 자신의 대답이 완전히 정확하므로 자신이 말하는 것을 명심하십시오. 내가 당신에게에 대해이야하는 것은 자세한 설명은 아니지만, 어떻게 기억하는 아주 쉬운 방법 e.target, e.currentTarget작업 마우스 이벤트 및 표시 목록과 관련을 :
e.target= 마우스 아래에있는 것 (벤이 말한 것처럼 … 이벤트를 유발하는 것).
e.currentTarget= 점 앞에있는 것 … (아래 참조)
따라서 인스턴스 이름이 “btns”인 클립 안에 10 개의 버튼이 있고
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”클립이됩니다.
그것의 가치가 지적 당신은 ROLL_OVER로 된 MouseEvent를 변경하거나 속성을 설정하면 btns.mouseChildrenfalse로, e.target그리고 e.currentTarget모두 항상 “btns”입니다.
답변
e.target이벤트 디스패처가 트리거되도록 트리거하고 e.currentTarget리스너를 할당 한 것입니다.
답변
e.currentTarget항상 이벤트가 실제로 바인딩 된 요소입니다. e.target은 이벤트가 시작된 요소이므로 마크 업의 구조에 따라 e.target의 하위 요소 e.currentTarget이거나 e.target=== e.currentTarget일 수 있습니다 .
답변
나는 시각적 인 답변을 좋아합니다.
를 클릭 #btn하면 두 개의 이벤트 핸들러가 호출되고 그림에 표시된 것을 출력합니다.
여기 데모 : https://jsfiddle.net/ujhe1key/
답변
예를 들어, 단일 리스너를 사용하여 다른 작업을 트리거하는 경우 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) 내에서 다른 작업을 트리거하십시오.
답변
예를 들어 보자.
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가 드래그되지 않도록 다음 코드를 작성할 수 있습니다.
function dragImageOnly(e:MouseEvent):void
{
if(e.target==e.currentTarget)
{
return;
}
else
{
Image(e.target).startDrag();
}
}
