e.targetとe.currentTargetの違い

違いはわかりません。どちらも同じように見えますが、違いはあると思います。

どちらか一方をいつ使用するかの例をいただければ幸いです。

ベンの答えは完全に正しいです。ですから、彼の言うことを覚えておいてください。これからお伝えするのは完全な説明ではありませんが、マウスイベントと表示リストに関連してどのよう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.target10個のボタンの1つにe.currentTargetなり、常に「btns」クリップになります。

MouseEventをROLL_OVERに変更したり、プロパティbtns.mouseChildrenをfalseに設定しe.targetたりe.currentTargetすると、どちらも常に「btns」になることに注意してください。

e.targetイベントディスパッチャーをトリガーするトリガーでありe.currentTarget、リスナーを割り当てたものです。

e.currentTarget常に、イベントが実際にバインドされる要素です。e.targetイベントの発信元要素があるので、e.targetの子かもしれないe.currentTarget、あるいはe.target===可能性がありe.currentTarget、あなたのマークアップが構成されている方法に応じて、。

私は視覚的な答えが好きです。

をクリックすると#btn、2つのイベントハンドラーが呼び出され、画像に表示されているものを出力します。

ここのデモ：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）内で別のアクションをトリガーします（nameプロパティなどを使用します...）

例を挙げます：

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();
     }
}

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.

• e.targetは、クリックした要素です
• e.currentTargetは、イベントリスナーが追加された要素です。

ボタンの子要素をクリックする場合は、currentTargetを使用してボタンの属性を検出することをお勧めします。CHでは、e.targetを使用することが問題になる場合があります。

e.currentTargetは、イベントが登録されている要素（親）であり、e.targetは、イベントが指しているノード（子）です。