Firebug を使用して JavaScript/jQuery イベント バインディングをデバッグするにはどうすればよいですか?

Firebug を使用した JavaScript/jQuery イベント バインディングのデバッグ

JavaScript/jQuery イベント バインディングの問題を切り分けることは、特にソース コードが変更されている場合に困難になることがあります。許可されていません。 Firebug は DOM 検査用の強力なツールを提供しますが、イベントのデバッグは依然としてわかりにくいです。

バインドされたイベント ハンドラーの公開

バインドされたイベント ハンドラーを公開するには、data() メソッドを利用できます。 jQuery の場合:

• jQuery 1.3.x:

var clickEvents = $('#foo').data("events").click;
jQuery.each(clickEvents, function(key, value) {
  console.log(value) // prints "function() { console.log('clicked!') }"
});

• jQuery 1.4.x 以降:

var clickEvents = $('#foo').data("events").click;
jQuery.each(clickEvents, function(key, handlerObj) {
  console.log(handlerObj.handler) // prints "function() { console.log('clicked!') }"
});

• jQuery 1.8.x 以降 (直接 DOM アクセス):

var clickEvents = $._data($('#foo')[0], "events").click;
jQuery.each(clickEvents, function(key, handlerObj) {
  console.log(handlerObj.handler) // prints "function() { console.log('clicked!') }"
});

jQuery にアクセスすることにより内部イベント ストレージを使用すると、バインドされたイベント ハンドラーの関数参照を取得して、その実装を検査できるようになります。これにより、実行フローをトレースし、潜在的な問題を診断できます。

以上がFirebug を使用して JavaScript/jQuery イベント バインディングをデバッグするにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。