DOM Gecko: event Objekt universal verfügbar machen

[Mathias]

Beim Internet Explorer hat man immer und überall (z.B. in jeder Funktion) per window.event zugriff auf das aktuelle Event.
Kann man ein analoges für den Firefox erreichen, ohne jedes Mal dass event objekt als parameter übergeben zu müssen.

Ein Eventhandler, der mit
window.event = eventhandler;
initialisiert wird, reicht nicht aus, wenn auf ein input feld mit onclick="function()" geklickt wird, denn dann wird erst die onclick Funktion gerufen, erst danach dass event auf window Ebene.

Kann man performant allen html objekten per default einen click-handler zuweisen, der erst das event registriert und dann die ursprüngliche funktion aufruft, so dass in dieser dass event dann zu Verfügung steht?

Danke für Eure Hilfe!

[Struppi]

initialisiert wird, reicht nicht aus, wenn auf ein input feld mit onclick="function()" geklickt wird, denn dann wird erst die onclick Funktion gerufen, erst danach dass event auf window Ebene.

Du suchst: onclick="function(event)"

Struppi.

[Mathias]

Du suchst: onclick="function(event)"

Danke für die Antwort, dass ist aber nicht ganz, oder genau nicht was ich suche. Ich möchte dass event-Objekt immer verfügbar haben, und nicht jedesmal in der parameter Liste mit übergeben müssen.

Einfach analog zum IE, bei dem auf jeder Ebene im DOM Baum das Event über window.event abfragbar ist, ohne parameter übergabe.

es muss doch sowas geben wie
window.click = clickhandler;
function clickhandler(e) {
 evnt = e;
 routeEvent(e)
 return (e) ? true : false;
}

ABER, der eventhandler soll nicht erst gerufen werden, nachdem der dom baum durchlaufen wurde, sondern BEVOR!

Danke & Gruß,

[Struppi]

Du suchst: onclick="function(event)"

Danke für die Antwort, dass ist aber nicht ganz, oder genau nicht was ich suche. Ich möchte dass event-Objekt immer verfügbar haben, und nicht jedesmal in der parameter Liste mit übergeben müssen.

Ich weiß, aber das geht nicht, da Gecko Browser für jeden Event anscheinend ein separates Eventobjekt erstellen.

ABER, der eventhandler soll nicht erst gerufen werden, nachdem der dom baum durchlaufen wurde, sondern BEVOR!

Wieso DOM Baum durchlaufen?
Der eventhandler wird direkt der Eventfunktion mitgegeben.

Struppi.

[Mathias]

Wieso DOM Baum durchlaufen?
Der eventhandler wird direkt der Eventfunktion mitgegeben.

Dass bezog sich auf mein Beispiel.

window.onclick = eventhandler;

Wenn man auf ein input Feld klickt, dass in einer Zelle, in einer Reihe, in einer Tabelle, usw. geschachtelt wird, dann wird mit dem Click der DOM Baum druchlaufen.

Erst
input -> td -> tr , usw. bis dass window objekt erreicht ist.
Es sei denn man stoppt irgendwo die Propagation.

Tja, und dass window objekt, für dass sich der event handler ganz einfach definieren lässt, steht am ende, nicht am anfang der kette.

Eine Idee ist noch in einer onLoad Funktion sämtliche vorkommenden Tags mit demn eventhandler zu belegen, wie
document.getElementsByTagName().onclick = eventhandler;

Das hat aber 2 Nachteile:
1.) Die Seite wird bei hunderten von HTML Tags spürbar langsamer geladen / aufgebaut
2.) dynamisch hinzugefügte tags müssen immer berücksichtigt werden ...

gruß,
mathias

[Struppi]

Wieso DOM Baum durchlaufen?
Der eventhandler wird direkt der Eventfunktion mitgegeben.

Dass bezog sich auf mein Beispiel.

window.onclick = eventhandler;

Wenn man auf ein input Feld klickt, dass in einer Zelle, in einer Reihe, in einer Tabelle, usw. geschachtelt wird, dann wird mit dem Click der DOM Baum druchlaufen.

Erst
input -> td -> tr , usw. bis dass window objekt erreicht ist.
Es sei denn man stoppt irgendwo die Propagation.

Ja gut aber was hat das mit dem Event Objekt zu tun? Dieses wird doch durchgereicht oder nicht?

Vielleicht findets du hier link:http://www.quirksmode.org/js/events_order.html] was hilfreiches.

Struppi.

[mathias]

Wenn man auf ein input Feld klickt, dass in einer Zelle, in einer Reihe, in einer Tabelle, usw. geschachtelt wird, dann wird mit dem Click der DOM Baum druchlaufen.

Erst
input -> td -> tr , usw. bis dass window objekt erreicht ist.
Es sei denn man stoppt irgendwo die Propagation.

Ja gut aber was hat das mit dem Event Objekt zu tun? Dieses wird doch durchgereicht oder nicht?

»»

War nur Teil der Problemerklärung, wird duchgereicht, stimmt.

Vielleicht findets du hier link:http://www.quirksmode.org/js/events_order.html] was hilfreiches.

Gut erklärende Seite. Habe zwar noch keine neuen Erkenntnisse gefunden, die mein Problem lösen, aber das mit der Event-Order ist schon der richtige Ansatzpunkt.

Gruß,
mathia

Struppi.

[molily]

Hallo,

Ein Eventhandler, der mit
window.event = eventhandler;
initialisiert wird, reicht nicht aus, wenn auf ein input feld mit onclick="function()" geklickt wird, denn dann wird erst die onclick Funktion gerufen, erst danach dass event auf window Ebene.

Wo ist dabei das Problem? Was willst du ausführen, bevor der Handler des Ursprungselement gefeuert wird?

Der Event steigt wie gesagt auf und erreicht document.documentElement bzw. document bzw. window.
Dort kannst du darauf reagieren. Zum Beispiel überprüfen, von welchem Element der Event ausging und dementsprechend Änderungen im Dokument vornehmen. Oder dafür sorgen, dass die Standardaktion nicht ausgeführt wird.
Damit musst du nicht unzähligen Elementen im Dokument Handler zuweisen, sondern nur einem Element, das alle fraglichen umspannt (letztlich also document bzw. document.documentElement).

Das Script unter http://molily.de/css-position-fixed#javascript-alternative arbeitet z.B. so.

Kann man performant allen html objekten per default einen click-handler zuweisen, der erst das event registriert und dann die ursprüngliche funktion aufruft, so dass in dieser dass event dann zu Verfügung steht?

Äh. Wo willst du denn auf das Event-Objekt zugreifen und kannst dies nicht? Also warum muss das Event-Objekt im globalen Geltungsbereich liegen?

Ich verstehe dich nicht ganz. Falls du den Event abfangen willst, *bevor* er überhaupt das Ursprungselement erreicht, dann kannst du einen click-Handler in der sogenannten Capturing-Phase registrieren. Der Event steigt nämlich nicht einfach von einem Element auf, sondern steigt erst von document bis zum Element hinunter und dann wieder hinauf. (Deshalb ist »Zielelement« besser als »Ursprungselement«.) Das funktioniert in einem DOM-Events-konformen Browser über document.addEventListener("click", handler, true);. In der Handler-Funktion kannst du dann z.B. Eventobjekt.stopPropagation(); ausführen, um das Herabsteigen des Events zum Zielelement abzubrechen.

Vom Prinzip her:

<html><head>  
<script type="text/javascript">  
[code lang=javascript]function load (e) {  
 document.getElementById("bla").addEventListener("click", function (e) { alert("clicked"); }, false);  
}  
window.addEventListener("load", load, false);  
function handler (e) {  
 if (e.target.id == "bla") {  
  alert("Events mit dem Zielelement id='bla' werden abgefangen");  
  e.stopPropagation();  
 }  
}  
document.addEventListener("click", handler, true);  

~~~</script>  
</head>  
<body>  
<p id="bla">bla</p>  
</body>  
</html>[/code]  
  
Unter dem Strich können das Opera, Gecko, Konqueror und Safari, aber nicht MSIE. Konqueror und Safari machen Probleme, weil der Event vom Textknoten statt vom Element ausgeht, da muss man das Zielelement anders ansprechen (e.target.parentNode). Das steht alles auf der von Struppi verlinkten Seite.  
  
Mathias