.delegateのセレクタを取得する

Question

このコードでは、DOMオブジェクト（.tabs）をデリゲートが配線されている元のセレクタにする必要があります。

$(".tabs").delegate("li:not(.selected) a", "click", function() { 
//^ 
// | 
// +-----------i need to get this dom object 
    var selector = $(this).selector; // <---- returns an empty string ? 
    return false; 
}); 

.tabsはどのようにしてオブジェクトにアクセスするのですか？

Answer 1

誰かがよりスマートな方法が見つかるまで、この問題を回避するには、選択した要素自体にイベントハンドラをアタッチすることができます

$('.tabs').click(function(event) { 
    event.root = this; // or whatever name suits you best 
}); 

$(".tabs").delegate("li:not(.selected) a", "click", function (event) { 
    // event.root contains the DOM element 
}); 

jQueryのイベントハンドラは、それらが結合している順に実行されることを保証します。

それとも、まったくdelegateを使用してセレクタを自分でテストすることはありません（これはおそらく最良の解決策です）：

$('.tabs').click(function(event) { 
    if($(event.target).is("li:not(.selected) a")) { 
     // this refers to the .tab DOM element 
     // event.target refers to the originally clicked element 
    } 
}); 

---

更新：

元Eventオブジェクトはevent.originalEventから入手できます。だから、あなたができる：

$(".tabs").delegate("li:not(.selected) a", "click", function (event) { 
    var dom = event.originalEvent.currentTarget; 
}); 

しかし、currentTargetのみIE9でサポートされているようだと下IEのバージョンには選択肢がありません。

したがって、ほとんどのクロスブラウザ対応ソリューションは、依然として上記のものです。

Answer 2

.on()メソッドでは、イベントオブジェクトを関数に渡してそのdelegateTargetプロパティにアクセスすることによって、委任先にアクセスできます。

例：

$('.foo').on('click', 'a', function(ev) { 
    // this is the .foo element for this anchor 
    console.log(ev.delegateTarget); 
}); 

実施例：http://jsfiddle.net/corydorning/ZzADh/