2

たくさんのJavascriptが載っているページがあります。含まれているのは、機能していない人気のあるTwitterブートストラップのポップオーバーウィジェットです。具体的には、「ポップオーバー」を起動するアイコンにカーソルを合わせると。HTML / JSは、この動作するjsfiddleとまったく同じであるため正しいことを私は知っています：単純な動作例。

HTMLインラインは次のとおりです。

   <span id="container">
<i id="common-actions-info" 
    class="icon-info-sign" 
    rel="popover"
    data-trigger='hover'
    data-delay={show:10,hide:500}
    data-placement="right"
    data-title="Common Actions" 
    data-content="A list of actions that you have been using frequently. Choosing any of these actions will open up a new quick entry form to add another of these items."></i>

そして、ポップオーバーJavaScriptを次のように接続します：

$("[rel=popover]").popover();​

より複雑な「実環境」で実行できます

$（ "[rel = popover]"）。popover（'show / hidden'）

コマンドとそれは機能しますが、アイコンにカーソルを合わせたときに表示する信号が得られません。とにかく、問題は、他のJSがホバーイベントをキャッチしていて、ポップオーバーの表示をトリガーしていないことだと思います。

Chromeのデバッガーを使用してDOMイベントを監視し、ここで何が起こっているかを追跡する良い方法はありますか？

アップデート：

Chromeデベロッパーツールの[要素]タブにある[イベントリスナー]を見てきました。それが提供する情報のツリーにはまだ少し圧倒されていますが、重要なパターンを認識しました。「popover」プラグインが機能するページでは、ウィジェットに「mouseover」および「mouseout」イベントリスナーがあります。推測は、ウィジェットの表示のオンとオフを切り替える役割を果たします。それが機能しないページでは、これらのイベントは存在しません（これまでのところ、リスナーがまったくいないことを確認しました）。

誰かが何か考えを持っていますか：

  1. セットアップ中のBootstrapsリスナーと競合する可能性があるものは何ですか？
  2. 頭頂部の髪の毛を失うことなく、これをトラブルシューティングするにはどうすればよいですか？
4

1 に答える 1

1

Firebug という Chrome/Firefox プラグインを使用できます。

インストールして開き、DOM タブに移動してページを更新します。DOM アクション、関数の実行など、すべての詳細な概要が表示されます。

このページを見てください: https://getfirebug.com/dom。Firebug DOM エクスプローラーの基本的な機能を提供します。

これも良いチュートリアルです: http://www.softwareishard.com/blog/firebug/firebug-tip-log-dom-events/

編集 ：

イベントをトラップする方法があります。これは最善の解決策ではありませんが、他のプラグイン/フレームワークが必要なコンテナーを制御した場合に役立ちます。

クリックイベントを i#common-actions-info にバインドしているとしましょう

$('i#common-actions-info').click(function() { console.log('clicked!') });

次に、このコードを使用して、どのイベントが i#common-actions-info にバインドされているかを確認できます。

var clickEvents = $('i#common-actions-info').data("events").click;
jQuery.each(clickEvents, function(key, handlerObj) {
    console.log(handlerObj.handler) // will print "function() { console.log('clicked!') }"
})
于 2012-12-24T23:27:34.920 に答える