suit: Events lesen die auf deinem bestimmten Element liegen.

function bar() {  
  alert('clicked here');  
}  
  
document.getElementById('foo').addEventListener('click', bar, false);

Wie bekomme ich nun raus, dass das click-Event auf dem Element mit der ID foo liegt?

  1. Lieber suit,

    einmal davon abgesehen, dass <HTMLElementObject>.addEventListener() nicht in allen Browsern läuft (zumindest erinnere ich mich an unterschiedliche DOM-Implementationen), müsste bar dann so aussehen:

    function bar() {
        var elementID = this.id;

    alert('clicked here');

    if (elementID) {
            alert("Element carries this ID: '"+elementID+"':");
            if (elementID == "foo") {
                alert("Yes, it's element 'foo'!");
            }
        }

    }

      
    Liebe Grüße,  
      
    Felix Riesterer.
    
    -- 
    ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)
    
    1. einmal davon abgesehen, dass <HTMLElementObject>.addEventListener() nicht in allen Browsern läuft (zumindest erinnere ich mich an unterschiedliche DOM-Implementationen), müsste bar dann so aussehen:

      Das ist mir klar ;)

      function bar() {

      var elementID = this.id;

      alert('clicked here');
          if (elementID) {
              alert("Element carries this ID: '"+elementID+"':");
              if (elementID == "foo") {
                  alert("Yes, it's element 'foo'!");
              }
          }
      }

        
      Hallo - ich hab' mich unklar ausgedrückt: ich möchte von \_irgendwo\_ ausgehend wissen, welche Events auf einem Element liegen ohne dieses event ausführen zu müssen.  
        
      also z.B.  
        
      document.getElementById('foo').getEventListeners; oder etwas in die Richtung.  
        
      
      
  2. Moin.

    Keine Ahnung, ob Dir das hier hilft. Ein kleine Spielerei, die ich mittlerweile im grossen Stil benutze um das Pflegen von Events zu vereinfachen:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">  
    <html>  
    <head>  
      
    [code lang=javascript]<script type="text/javascript">  
      
    window.onload = function ()  
    {  
     idOne = document.getElementById("one");  
     idTwo = document.getElementById("two");  
     idThree = document.getElementById("three");  
      
     idTwo.onclick = function()  
     {  
      if (!idOne.onclick)  
      {  
       alert("no onclick exists");  
      }  
       else  
      {  
       alert("onclick exists");  
      }  
     }  
      
     idThree.onclick = function()  
     {  
      done = function()  
      {  
       alert("clicked");  
      }  
      idOne.onclick = done;  
     }  
      
    }  
      
    </script>
    

    </head>
    <body>

    <a id = "one">click</a>
    <a id = "two">check</a>
    <a id = "three">create</a>

    </body>
    </html>[/code]

    --
    Ich bin dafuer verantwortlich was ich sage, nicht dafuer, was Du verstehst.
    1. Moin.

      Keine Ahnung, ob Dir das hier hilft. Ein kleine Spielerei, die ich mittlerweile im grossen Stil benutze um das Pflegen von Events zu vereinfachen:

      Damit komme ich aber nur an die Eventhandler die per onclick, onmouseover usw als Attribute gesetzt sind - sehe ich das richtig?

      1. Damit komme ich aber nur an die Eventhandler die per onclick, onmouseover usw als Attribute gesetzt sind - sehe ich das richtig?

        Das kann ich Dir leider nicht beantworten, da ich hier nur den steinzeitlichen IE6 samt Standardfaehigkeiten habe. Das kann man mit addEventListener nichts anfangen. Privat hab ich mich mit extremen Eventbasteleien noch nicht beschaeftigt. Wuesste ich es genauer, haette ich dir konkreter geantwortet.

        Kann mir aber vorstellen, dass es genauso oder aehnlich funktioniert.

        --
        Ich bin dafuer verantwortlich was ich sage, nicht dafuer, was Du verstehst.
      2. Hallo,

        Damit komme ich aber nur an die Eventhandler die per onclick, onmouseover usw als Attribute gesetzt sind - sehe ich das richtig?

        Ja, sieht so aus.

        Siehe dazu den Abschnitt "Which event handlers are registered?" hier.

        Zitat: "Only in its very recent DOM Level 3 Events W3C adds an eventListenerList to store a list of event handlers that are currently registered on an element. This functionality is not yet supported by any browser, it’s too new."

        Der Artikel ist 2 Jahre alt.
        Vielleicht geht's inzwischen in manchen Browsern?

        Gruß, Don P

        1. Siehe dazu den Abschnitt "Which event handlers are registered?" hier.

          Danke, das hilft mir aber schon weiter:

          alert(element.click);
          alert(element.focus);

          Damit bekomm ich das, was ich will - sprich ich kann prüfen ob ein bestimmtes Event vorhanden ist oder nicht - die Liste der vordefinierten Events bzw der Events die ich benötige ist ja glücklicherweise endlich ;)

          1. Siehe dazu den Abschnitt "Which event handlers are registered?" hier.

            Danke, das hilft mir aber schon weiter:

            alert(element.click);
            alert(element.focus);

            Damit bekomm ich das, was ich will

            Du meinst wohl element.onclick und element.onfocus.

            Damit bekommst du das, was du vorher in diese Objekteigenschaften reingeschrieben hast. Das tut man beim traditionellen Event-Handling. Wenn du allerdings W3C DOM Events (also addEventListener) verwendest, dann bleibt element.onclick leer. Das steht auch bei ppk.

            sprich ich kann prüfen ob ein bestimmtes Event vorhanden ist oder nicht

            Was willst du nun genau prüfen? Willst du prüfen, ob bei einem gegebene Element e eine bekannte Funktion f als Handler für einen Ereignis-Typ t registriert ist? Oder willst du prüfen, ob bei einem gegebenen Element e *irgendeine* Funktion als Handler für einen Ereignis-Typ t registriert ist? Beides ist, wenn ich das richtig überblicke, mit DOM Events nicht möglich.

            Mathias

            1. Du meinst wohl element.onclick und element.onfocus.

              Nein ;) ob da ein onclick-Attribut notiert ist, sehe ich so auch.

              Damit bekommst du das, was du vorher in diese Objekteigenschaften reingeschrieben hast. Das tut man beim traditionellen Event-Handling. Wenn du allerdings W3C DOM Events (also addEventListener) verwendest, dann bleibt element.onclick leer. Das steht auch bei ppk.

              Natürlich und wenn mit addEventListener "click" definiert wurde ist logischerweise onclick undefined ;)

              Was willst du nun genau prüfen? Willst du prüfen, ob bei einem gegebene Element e eine bekannte Funktion f als Handler für einen Ereignis-Typ t registriert ist? Oder willst du prüfen, ob bei einem gegebenen Element e *irgendeine* Funktion als Handler für einen Ereignis-Typ t registriert ist? Beides ist, wenn ich das richtig überblicke, mit DOM Events nicht möglich.

              Zweiteres - und das ist per DOM Level 3 möglich - unterstützen tut das aber kein Browser (according to wikipedia).

              1. Oder willst du prüfen, ob bei einem gegebenen Element e *irgendeine* Funktion als Handler für einen Ereignis-Typ t registriert ist? Beides ist, wenn ich das richtig überblicke, mit DOM Events nicht möglich.

                Zweiteres - und das ist per DOM Level 3 möglich

                Zur Info, DOM 3 Events liegt als Working Draft vom 8. September 2009 vor sowie als Editor's Draft vom 4. August 2010. In keiner dieser aktuellen Versionen hat das EventTarget-Interface eine Eigenschaft »eventListenerList«. ppks Aussage bezieht sich auf einen Working Draft vom 8. Februar 2002, wo eventListenerList nur in den Changes, nicht im Interface selbst auftaucht.

                Mathias

  3. Hallo,

      
    
    > document.getElementById('foo').addEventListener('click', bar, false)
    
    

    Wie bekomme ich nun raus, dass das click-Event auf dem Element mit der ID foo liegt?

    z.B. so:

      
       var eventListeners = {};  
    
    > document.getElementById('foo').addEventListener('click', bar, false);  
    
       eventListeners.foo = {click: bar};  
    
    

    Dann kannst du das eventListeners-Objekt untersuchen um festzustellen, welche Elemente welche Listener registriert haben.

    Gruß, Don P

    1. Dann kannst du das eventListeners-Objekt untersuchen um festzustellen, welche Elemente welche Listener registriert haben.

      In einer kontrollierten Umgebung ja - aber wenn ein Fremdscript irgend ein event anhängt, hilft das wenig.

      Dennoch ein interessanter Ansatz.