Czyli jak to zrobić zgodnie z zaleceniami w3c albo jak to zrobić… tak, by działało ;] Problem dotyczy (tradycyjnie) IE, a także Safari, które stosują inne odwołania do obiektu Event i obiektu wywołującego zdarzenie.

Oto rozwiązanie podpatrzone na quirksmode.org (polecam!):
Plik XHTML z linkiem, do którego dodamy akcję po kliknięciu (onclick). Dobrą praktyką jest definiowanie akcji po załadowaniu strony za pomocą zdarzenia onload elementu body.


<body onload="addListeners();">
<a href="site.html" id="link">Kliknij na mnie!</a>
</body>

Plik JavaScript z oprogramowaną akcją:


function addListeners(){
document.getElementById("link").onclick=doSomething;
}

//domyślnie wg. w3c powinniśmy otrzymać obiekt klasy Event
function doSomething(e) {
	var targ;
	if (!e) var e = window.event; //naprawiamy bug IE
	if (e.target) targ = e.target;
	else if (e.srcElement) targ = e.srcElement;
	if (targ.nodeType == 3) //naprawiamy bug Safari
		targ = targ.parentNode;
}

W ten prosty sposób mamy rozwiązanie cross-browser. Funkcja doSomething dostarcza nam niezbędnych informacji w obiekcie klasy Event (zmienna e), a także referencję do obiektu, który jest źródłem akcji (zmienna targ).

Więcej na ten temat (m.in. szczegółowa obsługa myszy/klawiatury) w tym artykule o eventach.

Skuteczne? Proste? Podziel się wrażeniami w komentarzu!