Prüfen ob sich eine bestimmte Funktion in einem Listener befindet?

DataFox

DataFox

Erfahrenes Mitglied
Hi

ich habe eine Funktion mit der man einem Element einen Event-Listener anhängen kann:

Code: 
function addEvent(eo, eventType, function_name){
	if (eo.addEventListener) {
		eo.addEventListener(eventType, function_name, false);
	} else if (eo.attachEvent) {
		eo.attachEvent("on"+eventType, function_name);
	}
}

Dann verpasse ich einem Element einen Listener, etwa so:

Code: 
addEvent(document.getElementById('meinElement'), 'click', machDas);

function machDas(){
	alert('hallo');
}

wenn ich einem Element auf diese Weise einen Event-Listener verpasse, wie kann ich nachträglich abfragen ob das Element meinElement bereits einen Listener für die Funktion machDas bekommen hat?

Ich will vermeiden das ich einem Element einen Listener doppelt verpasse... man kann auf diese Weise ja mehrfach Listener anhängen, und es funktioniert auch problemlos einem element 100 mal machDas() bei einem click-event zu verpassen, und es wird dann auch 100 mal ausgeführt.

Habt ihr einen Tipp für mich? Weis ncht mehr weiter :(

Gruß
Laura
 
Hallo Laura,

du könntest die Methode von John Resig verwenden (nachzulesen bei quirksmode) und sie um eine entsprechende Abfrage erweitern:
Javascript: 
function addEvent( obj, type, fn )
{
	if (obj.addEventListener)
		obj.addEventListener( type, fn, false );
	else if (obj.attachEvent && !obj[type+fn]) // zusätzliche Abfrage
	{
		obj["e"+type+fn] = fn;
		obj[type+fn] = function() { obj["e"+type+fn]( window.event ); }
		obj.attachEvent( "on"+type, obj[type+fn] );
	}
}

function removeEvent( obj, type, fn )
{
	if (obj.removeEventListener)
		obj.removeEventListener( type, fn, false );
	else if (obj.detachEvent)
	{
		obj.detachEvent( "on"+type, obj[type+fn] );
		obj[type+fn] = null;
		obj["e"+type+fn] = null;
	}
}

Grüße,
Matthias
 
Hi

ich habe den Code ausprobiert und wollte nun auch Events wieder entfernen, aber irgendwas will da nicht so richtig. Bekomme immer die Fehlermeldung "Typkonflikt" in der Zeile

Code: 
obj.detachEvent("on"+type, obj[type+fn]);

mit einem alert habe ich getestet ob alle parameter richtig übergeben wurden. event-listener sind auf jeden fall registriert... was kann die meldung "Typkonflikt" hier bedeuten?

laut msdn-doku erwartet detachEvent() eher etwas wie...:

Code: 
obj.detachEvent("on"+type, function_name);
//obj.detachEvent("on"+type, obj[type+function_name]);

wenn ich es so mache, kommt auch die "Typkonflikt"-Meldung nicht mehr. Aber es t trotzdem nicht :(

habe den MSIE 6.0
Firebug im FF nutzt hier nichts... der FF gibt gar keine Meldung, aber es funktioniert dort auch nicht. Eine Idee was das sein kann?

Gruß
Laura
 
Zuletzt bearbeitet:
Hallo Laura,

könntest du vielleicht ein minimales Beispiel angeben, wo dieser Fehler auftritt? Ich kann ihn hier nicht reproduzieren. Mit folgendem Dokument klappt alles einwandfrei:

Code: 
<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="de">

<head>
  <title>Event Listener Test</title>
  <script type="text/javascript">
  <!--
    function addEvent( obj, type, fn )
    {
      if (obj.addEventListener)
        obj.addEventListener( type, fn, false );
      else if (obj.attachEvent && !obj[type+fn]) // zusätzliche Abfrage
      {
        obj["e"+type+fn] = fn;
        obj[type+fn] = function() { obj["e"+type+fn]( window.event ); }
        obj.attachEvent( "on"+type, obj[type+fn] );
      }
    }

    function removeEvent( obj, type, fn )
    {
      if (obj.removeEventListener)
        obj.removeEventListener( type, fn, false );
      else if (obj.detachEvent)
      {
        obj.detachEvent( "on"+type, obj[type+fn] );
        obj[type+fn] = null;
        obj["e"+type+fn] = null;
      }
    }

    function foo() {
      alert('foobar');
    }

    function attach() {
      addEvent(document.getElementById('link'), 'click', foo);
    }

    function detach() {
      removeEvent(document.getElementById('link'), 'click', foo);
    }
  -->
  </script>
</head>

<body>
<p>
  <a href="#" id="link">Test</a>
  <button onclick="attach()">Attach</button>
  <button onclick="detach()">Detach</button>
</p>
</body>

</html>

Grüße,
Matthias
 
Hi

ich weis nicht wieso, aber nun scheint es zu laufen. Habe jetzt aber noch ein ganz anderes Problem, das ich erst sehen konnte nach dem diese Sache hier funktioniert hat... hat aber nicht unbedingt hiermit etwas zu tun, deswegen mache ich einen neuen Thread auf :)

Danke!

Gruß
Laura
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück