onclick onblur などの JavaScript イベントをトレースするにはどうすればよいですか?

StackOverflow https://stackoverflow.com/questions/91367

  •  01-07-2019
  •  | 
  •  

質問

Internet Explorer 7 ですべての JavaScript イベントをデバッグまたはトレースする方法はありますか?

テキスト選択後にスクロールできなくなるバグがありますが、どのイベントまたはアクションがバグを引き起こしているのかわかりません。たとえば、マウスを動かしたときにどのイベントがトリガーされるかを実際に確認したいと考えています。

ソースを再配線するのは大変な作業なので、トリガーされたすべてのイベントを表示するスニファーのようなものがあればいいのにと思いました。

役に立ちましたか？

解決

ボークデュード氏はこう語った。

Visual Studio 2008 とその機能を試して JavaScript コードをデバッグしてみるとよいでしょう。

私はイベント処理を何度もハッキングしてきましたが、私の意見では、従来のステッピング デバッガーは長いコードの実行を追跡するのには便利ですが、イベントの追跡には適していません。マウス移動イベントをリッスンし、イベントごとに別のアプリケーションに侵入することを想像してください...したがって、この場合はログを記録することを強くお勧めします。

問題が Internet Explorer 7 に固有のものではなく、Firefox でも発生する場合は、JavaScript コードをデバッグする別の良い方法として、Firefox と ファイアバグ JavaScript デバッガを備えたアドオン。

そして、それもあります ファイアバグ ライト Internet Explorerの場合。使う機会がなかったのですが、ありました。:-) このデバッガの欠点は、本格的なデバッガではないことですが、まさに必要なものである window.console オブジェクトがあります。

他のヒント

onXYZ 関数が定義されているページ上のすべての要素をループし、それらの要素にトレースを追加します。

var allElements = document.all; // Is this right? Anyway, you get the idea.

for (var i in allElements) {
    if (typeof allElements[i].onblur == "function") {
        var oldFunc = allElements[i].onblur;
        allElements[i].onblur = function() {
             alert("onblur called");
             oldFunc();
        };
    }
}

Visual Studio 2008 とその機能を試して JavaScript コードをデバッグしてみるとよいでしょう。

問題が Internet Explorer 7 に固有のものではなく、Firefox でも発生する場合は、JavaScript コードをデバッグする別の良い方法として、Firefox と ファイアバグ JavaScript デバッガを備えたアドオン。次に、次のようにすることもできます console.log JavaScript コード内のステートメントの出力を確認できます。 コンソールウィンドウ Firebug では、イベント チェーンを混乱させることがあるアラートを使用する代わりに。

@[nickf] - 確かにそう思います document.all は Internet Explorer 固有の拡張機能です。

イベント ハンドラーをアタッチする必要があります。イベントを単に「監視」する方法はありません。Microsoft Ajax ライブラリの jQuery などのフレームワークを使用すると、イベント ハンドラーを追加するメソッドが簡単に提供されます。jQuery はセレクター フレームワークのおかげで優れています。

次に、Firebug (Firefox 拡張機能) を使用してブレークポイントを設定します。Firebug は、Visual Studio 2008 よりもセットアップと解体がはるかに簡単だと思います。

これは基本的なものですが、何かをトリガーしたときにアラートや document.write 呼び出しを貼り付けることができます。

明白な方法は、次のようなさまざまなイベントに対してアラートを設定することです。

element.onclick = function () { alert('Click event'); }

それ以外の場合は、アラートを dom のどこかに挿入するという、それほど煩わしくないオプションがあります。

ただし、次のようなライブラリの使用を真剣に検討してください。 jQuery 機能を実装します。クロスブラウザーの問題の多くは解決済みの問題なので、再度解決する必要はありません。あなたが実現しようとしている機能については正確にはわかりませんが、おそらく、使用できる jQuery 用のスクロールおよび選択プラグインがたくさんあるでしょう。

正確なコードはわかりませんが (複雑な JavaScript コードを書くのは久しぶりです)、フォーム上のすべてのコントロールを列挙し、イベントがトリガーされたときに何かを出力するイベントを添付することはできます。

匿名関数を使用して、どのイベントがトリガーされているかを特定するために必要な情報をラップすることもできます。

私がやりたいことの 1 つは、JavaScript でバインド関数を作成することです ( プロトタイプ ライブラリ)、特にイベント用に作成され、「イベント」オブジェクトをバインドされた関数に渡します。これを行う場合は、それを使用するすべてのハンドラーに対して呼び出されるトレース呼び出しを単純にスローするだけで済みます。そして、不要になったら削除します。一箇所。簡単。

ただし、どのようにトレース ステートメントを呼び出すかに関係なく、やはりそれを確認する必要があります。最善の戦略は、トレース呼び出しを処理する別のペインまたはウィンドウを用意することです。 道場ツールキット Internet Explorer で動作するコンソールが組み込まれており、同様のものは他にもあります。これを行う古典的な方法は、新しいウィンドウを作成し、 document.write それに。

  • 各トレースに日付と時刻を付けることをお勧めします。以前はかなりお世話になりました。
  • デバッグやアラートは、通常のイベント フローを中断するため、通常は役に立ちません。

マット・バーセスは、あなたが探しているようなものを持っています Trace Console AjaxControlToolkit コントロールを使用した ASP.NET AJAX アプリケーションのデバッグ.

ヤフーをベースにしています ゆい ロガー、 ユイ2：ロガー.

私の提案は、FireFox を FireBug と一緒に使用し、組み込みの Debug/Trace オブジェクトを使用することです。それらは魅力です。

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top