Dvakrát měř, jednou řež – hlavně při kódování pro IE

Dnes se mi stala nemilá věc. Zjistil jsem, že pracně kódovaný web nechodí v IE. A jal jsem se tedy hledat chybu.

Většinou se snažím stránku kódovat tak, aby nedošlo k nějakým problémům mezi prohlížeči – většinu chyb a nebezpečných míst již znám a není se jim problém vyhnout. Tentokrát jsem však vůbec nemyslel. Potřeboval jsem vyřešit skrývání určitého prvku na stránce.

Prvek jsem tedy nastyloval jako display:none; a pomocí javascriptu ho poté v návaznosti na akci zobrazoval. Bohužel oním prvkem byl tag <tr> a já už web optimisticky testoval pouze ve Firefoxu. Druhým zádrhelem bylo nastavení oné akce. Potřeboval jsem, aby se prvek zobrazoval po vybrání položky v <select> a tak jsem dopsal eventy onClick přímo do jednotlivých <option>.

Ve Firefoxu mi to krásně fungovalo a já se radoval. Bohužel jsem pak web pustil v IE a divil se, proč se mi nic nezobrazuje ani při zběsilém klikání ve formuláři. Chvilku jsem hledal chybu ve skriptu a nakonec začal googlovat.

Ano, je to tak. <option> není tag, do kterého lze psát eventy pro javascript a protože mi to ve Firefoxu fungovalo, tak jsem to moc neřešil. IE se zde chová správně a nereaguje na ně. Přesto to ale naštve, zvláště když to znamená přepsání celkem hodně kódu. Ale mohl jsem si za to sám – nemyslel jsem.

No a když se mi to nezobrazovalo ani po této opravě, už jsem nevěděl, kde by mohla být chyba. V zoufalství mě napadla ještě jedna věc a google ji potvrdil. IE bohužel nedokáže nastavit display:table-row;, takže po chvilce zkoušení jsem to vzdal, do všech <tr></tr> jsem doplnil tag <div>, který se dá zobrazit jako inline-block a poté to vypadá správně ve všech prohlížečích.

Totálně zabitý večer jen kvůli tomu, že jsem nepřemýšlel a kódoval bez rozmyslu. Člověk se asi musí jednou za čas vytrestat, aby si dával pozor.

Napsat komentář

Vaše emailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *