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