2012-01-28 7 views
68

を使用してノードに執着:は、イベントリスナーは、私はすでに、これらの質問を見てきましたaddEventListenerを

しかしそれらのどれもリストを取得する方法を答えていませんノードに接続されたイベントリスナーのうち、addEventListenerを使用して、イベントが受信する前にaddEventListenerプロトタイプを変更することなくersが作成されます。

VisualEventは、すべてのイベントリスナー(iphone固有のイベントリスナー)を表示せず、プログラムでこれを実行したい(多少)。

+0

可能な重複ノードをデバッグするときやJSコードから?](http://stackoverflow.com/questions/446892/how-to-find-event-listeners-on-a-dom-node-when-debugging-or-from-the -js-code) – Nickolay

+0

"ややプログラム的に"、そしてこの問題の[受け入れられた答え](http://stackoverflow.com/a/15666321/1026)がdevtoolsの特徴であるという事実は、リストされた質問の複製です。 JS解決策を探している人には、[答えは "存在しない"](http://stackoverflow.com/a/10030771/1026) – Nickolay

答えて

95

Chrome DevTools、Safari Inspector、およびFirebugサポートgetEventListeners(node)

getEventListeners(document)

+0

これは 'orientationchange'イベントのために機能しますか? – JohnK

+2

getEventListenersメソッドがFirefox 35バージョンをサポートしていないことに注意してください。 – MURATSPLAT

+0

Firefoxではうまくいかないかもしれませんが、devsは複数のブラウザで開発されています/既存のサイトを変更する必要がある場合は、このようにしてください。 – JasonXA

47

できません。

ノードに接続されているすべてのイベントリスナーのリストを取得する唯一の方法は、リスナーのアタッチコールを代行受信することです。

DOM4 addEventListener

リスナーに設定入力する設定タイプ、リスナーとイベントリスナーの関連リストにイベントリスナーを追加言うと、既にイベントがない限り捕捉は、捕捉するように設定します同じタイプ、リスナー、およびキャプチャを持つリスト内のリスナー。

「イベントリスナーのリスト」にイベントリスナーが追加されたことを意味します。それで全部です。このリストが何であるべきか、どのようにアクセスするべきかの概念はありません。

+7

これがうまくいかなければならない理由の正当性や推論を提供する機会方法?明らかに、ブラウザーはすべてのリスナーが何であるかを知っています。 – Fuser97381

+2

@ user973810:どのように彼はこれを正当化しますか? DOM APIはこれを行う方法を提供しておらず、現在のブラウザでは非標準的な方法はありません。なぜこれが当てはまるのか、私は本当に知りません。それはやりたいことは合理的なようです。 –

+0

私は、このためにDOMにAPIを追加することについて周りにいくつかのスレッドがあるのを見ました。 – Raynos

1

あなたは$ ._データを使用して、すべてのjQueryのイベントを取得することができる($( '[セレクタ]')[0]、 'イベント')。 [セレクタ]を必要なものに変更してください。

eventsReportというjQueryによって添付されたすべてのイベントを収集するプラグインがあります。

また、より適切な書式設定でこれを行う独自のプラグインを作成します。

しかし、とにかく、私たちはaddEventListenerメソッドによって追加されたイベントを収集できないようです。私たちのラップコールの後に追加されたイベントをストアするaddEventListenerコールをラップすることができるかもしれません。

devツールで要素に追加されたイベントを見るのが最善の方法です。

ただし、委任されたイベントは表示されません。そこで、jQuery eventsReportが必要です。

更新:今すぐaddEventListenerメソッドで追加されたイベントが表示されます。この質問には正しい回答を参照してください。

+0

これは非公開かつ廃止されたインターフェースです。すぐに消えるかもしれないので、それに頼らないでください。 – mgol

+1

しかし、私が答えた時点では、開発ツールにそのような能力はありませんでした。だから、何も選択することはできませんでした。 – Rantiev

+0

@Rantievは推奨されていません。その回答を削除できますか? –

15

これを行うにはネイティブな方法がありませんので、ここで私が見つけた控えめソリューションは、(任意の「古い」のプロトタイプメソッドを追加いけない)である:DOMのイベントリスナーを見つける[方法の

var ListenerTracker=new function(){ 
    var is_active=false; 
    // listener tracking datas 
    var _elements_ =[]; 
    var _listeners_ =[]; 
    this.init=function(){ 
     if(!is_active){//avoid duplicate call 
      intercep_events_listeners(); 
     } 
     is_active=true; 
    }; 
    // register individual element an returns its corresponding listeners 
    var register_element=function(element){ 
     if(_elements_.indexOf(element)==-1){ 
      // NB : split by useCapture to make listener easier to find when removing 
      var elt_listeners=[{/*useCapture=false*/},{/*useCapture=true*/}]; 
      _elements_.push(element); 
      _listeners_.push(elt_listeners); 
     } 
     return _listeners_[_elements_.indexOf(element)]; 
    }; 
    var intercep_events_listeners = function(){ 
     // backup overrided methods 
     var _super_={ 
      "addEventListener"  : HTMLElement.prototype.addEventListener, 
      "removeEventListener" : HTMLElement.prototype.removeEventListener 
     }; 

     Element.prototype["addEventListener"]=function(type, listener, useCapture){ 
      var listeners=register_element(this); 
      // add event before to avoid registering if an error is thrown 
      _super_["addEventListener"].apply(this,arguments); 
      // adapt to 'elt_listeners' index 
      useCapture=useCapture?1:0; 

      if(!listeners[useCapture][type])listeners[useCapture][type]=[]; 
      listeners[useCapture][type].push(listener); 
     }; 
     Element.prototype["removeEventListener"]=function(type, listener, useCapture){ 
      var listeners=register_element(this); 
      // add event before to avoid registering if an error is thrown 
      _super_["removeEventListener"].apply(this,arguments); 
      // adapt to 'elt_listeners' index 
      useCapture=useCapture?1:0; 
      if(!listeners[useCapture][type])return; 
      var lid = listeners[useCapture][type].indexOf(listener); 
      if(lid>-1)listeners[useCapture][type].splice(lid,1); 
     }; 
     Element.prototype["getEventListeners"]=function(type){ 
      var listeners=register_element(this); 
      // convert to listener datas list 
      var result=[]; 
      for(var useCapture=0,list;list=listeners[useCapture];useCapture++){ 
       if(typeof(type)=="string"){// filtered by type 
        if(list[type]){ 
         for(var id in list[type]){ 
          result.push({"type":type,"listener":list[type][id],"useCapture":!!useCapture}); 
         } 
        } 
       }else{// all 
        for(var _type in list){ 
         for(var id in list[_type]){ 
          result.push({"type":_type,"listener":list[_type][id],"useCapture":!!useCapture}); 
         } 
        } 
       } 
      } 
      return result; 
     }; 
    }; 
}(); 
ListenerTracker.init(); 
+1

私はこの解決策が好きです。これはより多くのupvotesに値する。 – Ju66ernaut

+0

また、それを傍受ウィンドウのイベントリスナーにする必要があります。それ以外は、これは素晴らしいです! –