Programowanie akcji w JavaScript

 

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!

 
 

Flash na stronie – po prostu.

 

Nie korzystaj z gotowych generatorów kodu do umieszczania obiektu Flash na stronie. Zawierają one mnóstwo niepotrzebnego kodu. Po pozbyciu się śmieci, pozostaje nam:

<object width="300" height="200">
 <param name="movie" value="banner.swf">
 <embed src="banner.swf" width="300" height="200">
 </embed>
 </object>

Standard xhtml 1.0 strict nie dopuszcza użycia tagu <embed>, ale robimy to specjalnie dla IE, która sama stanowi własne standardy…

That’s all folks!

 
 
« poprzednie wpisy