Change the background color of the <div> element (an ancestor of the <button> element):
$("div").on("click", "button", function(event){
$(event.delegateTarget).css("background-color",
"pink");
});
Try it Yourself »
event.delegateTarget プロパティは、 実行中のイベントハンドラが接続された要素を返します。
このプロパティは、イベントを処理している要素の祖先要素において、 on() メソッドを利用してハンドラをバインドしたイベント委譲の場合に役立ちます。
チップ: イベント委譲ではなく直接要素にハンドラをバインドした場合は、event.delegateTarget は event.currentTarget と同値です（下の例を参照）。
訳注：訳文が怪しいので、原文を参照のこと。
This property is useful for delegated events attached by the on() method, where the event handler is attached at an ancestor of the element being processed.
チップ: event.delegateTarget is equal to event.currentTarget, if the event is directly-bound to an element and no delegation occurs (see example below).
event.delegateTarget
| パラメータ | 説明 |
|---|---|
| event | 必須。event パラメータは、function にバインドしたイベント |
委譲による delegateTarget と currentTarget との違い
委譲が発生したときの delegateTarget と currentTarget との違いを示します。
delegateTarget と currentTarget とは、イベントに直接バインドしたときは同値
delegateTarget と currentTarget は、イベントに直接バインドしたときには同値であることを示します。