ほとんどの jQuery コードは、次のような無名関数を使用します。
jQuery('someelements').someEvent(function() {
// code here
});
これはうまく機能しますが、デバッグにはあまり適していません。Firefox Firebug と Chrome のインスペクターの両方を使用して、javascript の一時停止機能を使用して、いくつかの匿名関数のソースを見つけようとしましたが、実際に呼び出すコードは jQuery js ファイルにあり、コードをステップ実行しても、どの行、または何を示しているかさえわかりません。 .js ファイルにそのイベントが追加されました。アクションが定義されている場所を確認するにはどうすればよいですか?
縮小されていないバージョンのFirebugjQueryの機能を使用してprofile、コード内のイベントの発生時に呼び出されているjQueryソース内の正確な行を見つけてみてください。
いくつかのjQueryセレクターの実装または関数の実装を見つけることを意図している場合は、まさにそれを行うこの驚くべきリソースを参照してください：
http ://www.keyframesandcode.com/resources/javascript/deconstructed/jquery/
jQuery またはその他の (特定の) ライブラリによって登録されたイベントを表示できる Google Chrome/Firefox プラグインがあります: Visual Event。
同様の質問:検査された要素にバインドされている Javascript イベントを見つけるための Firefox 拡張機能?
私が役に立ったことの 1 つは、イベント ハンドラーが他の場所で呼び出されていなくても、イベント ハンドラーに名前を付けることです。そうすれば、プロファイリング ツールで簡単に識別できます。
例えば
jQuery('someelements').someEvent(function someEventHandler() {
// code here
});
すべてのイベント ハンドラーに名前が付けられたら、jquery dev バージョンをハックして、イベントとハンドラーの名前をログに記録できます。これを上記のイベントディスパッチメソッドに追加しますret = ... .apply()
var handler = ( (jQuery.event.special[ handleObj.origType ] || {}).handle || handleObj.handler );
console.log("FIRE EVENT ", event.type, "HANDLER: ", handler.name||'Anonymous Function');
私は完全にコンテキストにいるとは確信していません。ただし、関数が値として (たとえば、いくつかのオブジェクト プロパティの中で) 見つかった場合は、Chrome DevTools のコンテキスト メニューからいつでもそのソースに移動できます。
jQuery('someelements').someEvent(function(e) {
// code here
alert(e.target);
});