web-dev-qa-db-ja.com

jQueryを使用してイベントハンドラーにバインドされた関数にアクセスする

JQueryでは、.bind()またはイベントハンドラーヘルパー関数の1つを使用して、DOMオブジェクトでトリガーされたイベントに関数をバインドできます。

jQueryはこれを何らかの形で内部的に格納する必要があり、DOMオブジェクトが指定され、オブジェクトにバインドされているイベントを見つけてそれらの関数にアクセスできるかどうかは疑問です。目的の戻り結果は次のようになります。

{
  click: [function1, function2],
  change: [function3],
  blur: [function4, function5, function6]
}
jqueryeventsevent-handlingstorageinternal
50
googletorp

Edit：以下のメソッドはjQuery <1.7でのみ機能します

この記事では、興味深いヒントやコツをたくさん見つけることができます： jQueryについて知らないかもしれないこと 。

JQueryは data を使用してイベントハンドラーを格納しているようです：

JQueryのイベントストレージを介して、要素（または任意のオブジェクト）にバインドされたすべてのイベントハンドラーにアクセスできます。

// List bound events:
console.dir( jQuery('#elem').data('events') );

// Log ALL handlers for ALL events:
jQuery.each($('#elem').data('events'), function(i, event){
    jQuery.each(event, function(i, handler){
        console.log( handler['handler'].toString() );
    });
});

// You can see the actual functions which will occur
// on certain events; great for debugging!
35
PatrikAkerstrand

jQuery 1.7は、通常のdata（）関数でのイベントの公開を停止しました。あなたはまだこのようにそれらを得ることができます：

var elem = $('#someid')[0];
var data = jQuery.hasData( elem ) && jQuery._data( elem );
console.log(data.events);

これは、jQueryを使用してバインドされたイベントでのみ機能することに注意してください。私の知る限り、addEventListenerのような通常のDOM関数を使用してバインドされたすべてのイベントを確認する方法はありません。

ただし、これらはWebkitインスペクターで確認できます。[要素]タブで目的のDOMノードに移動し、右側にある[イベントリスナー]ドロップダウンを選択します。

67
eikes