Interval.cz

OhleduplnΘ otevφrßnφ nov²ch oken s JavaScriptem

V n∞kter²ch p°φpadech p°i otevφrßnφ odkazu do novΘho okna je pro u₧ivatele pohodln∞jÜφ, aby nevyskakovala dalÜφ okna, pokud mu ji₧ jedno "naÜe okno" vyskoΦilo - to je jednoduchΘ, nicmΘn∞ takovΘ okno se m∙₧e skr²t v pozadφ hlavnφho okna a u₧ivatel pak nezaregistruje, ₧e se jeho obsah zm∞nil. V Φlßnku si nejen ukß₧eme, jak namφsto otev°enφ dalÜφho okna jen p°enΘst ji₧ otev°enΘ okno do pop°edφ, ale takΘ jak se s₧φt s v souΦasnosti hojn∞ vyu₧φvan²mi blokßtory vyskakovacφch oken.

Tento Φlßnek voln∞ navazuje na na p°edchozφ Φlßnky o chyt°ejÜφm a ohledupln∞jÜφm otvφrßnφ nov²ch oken a reaguje i na zm∞ny, kterΘ p°inesl Service Pack 2 pro Windows XP a masovΘ rozÜφ°enφ r∙zn²ch toolbar∙ umo₧≥ujφcφch automatickΘ blokovßnφ vyskakovacφch oken.

AΦkoli si leckdo °ekne, ₧e nastavit odkazu atribut target a do dokumentu v otevφranΘm okn∞ nastavit na udßlost onload vykonßnφ metody focus() je trivißlnφ (a mß sv²m zp∙sobem pravdu), v naÜφ ukßzce vy°eÜφme vφce problΘm∙ najednou:

• Atribut target ve vyÜÜφch verzφch XHTML nenφ podporovßn a navφc jeho pou₧itφ pro otev°enφ novΘho okna kompletn∞ znemo₧nφ u₧ivateli p°ejφt na odkaz v p°φpad∞, ₧e mß aktivnφ blokovßnφ otevφrßnφ nov²ch oken. Jako nßhradu proto pou₧ijeme nastavenφ vlastnosti target v DOM pomocφ klientskΘho skriptovßnφ, a to pouze tehdy, pokud je toto opravdu pot°eba.
• Abychom mohli ovlßdat otvφranΘ okno, musφme jej otev°φt skriptem prost°ednictvφm window.open() - to je vpo°ßdku, musφme ovÜem zajistit i funkΦnost bez podpory skriptovßnφ a v p°φpad∞ skriptovßnφ oÜet°it stav, kdy mß klient "vyskakovßnφ" oken blokovßno.
• Pokud jsme okno otev°eli pomocφ window.open() a zachovali si v prom∞nnΘ jeho handler, m∙₧eme pak uplatnit metodu focus() - je vÜak t°eba se ujistit, ₧e okno nebylo zav°eno dotazem na vlastnost window.closed.
• Ne v₧dy mßme mo₧nost zasahovat do dokumentu otvφranΘho do novΘho okna, p°idßnφ onload="window.focus();" nenφ v₧dy mo₧nΘ a Φasto ani vhodnΘ, pokud je dokument n∞jak interaktivnφ.
• V n∞kter²ch aplikacφch se nßm u₧ivatel v novΘm okn∞ p°ihlaÜuje do n∞jakΘ dopl≥kovΘ aplikace - m∙₧e jφt nap°φklad o r∙znΘ nastavovßnφ slu₧eb, administraΦnφ rozhranφ a podobn∞. Pokud budeme schopnφ ji₧ otev°enΘ okno s p°ihlßÜen²m u₧ivatelem pouze p°enΘst do pop°edφ, u₧ivatel o svΘ p°ihlßÜenφ nep°ijde. Pokud bychom na dalÜφ kliknutφ u₧ivatele v hlavnφm okn∞ otev°eli novΘ okno, u₧ivatel by o p°ihlßÜenφ p°iÜel (pokud nepou₧φvßme cookies), co₧ je nepohodlnΘ.

V²sledkem je krßtk² skript, kter² umφs¥ujeme do hlavnφ strßnky. Strßnka (dokument) v otevφranΘm okn∞ nßs v∙bec nemusφ zajφmat, m∙₧e b²t i z ·pln∞ cizφho serveru a p°esto se korektn∞ p°enese do pop°edφ, jakmile klikneme na odkaz v mate°skΘ strßnce. ProhlΘdn∞te si ukßzku (zdrojov² k≤d) odkazujφcφ takΘ na zadßnφ novΘho p°φsp∞vku do diskuse naÜeho Interf≤ra a na editaci profilu. VyzkouÜejte p°itom chovßnφ, kdy₧ je novΘ okno otev°eno a je v pozadφ, kdy novΘ okno zav°ete a kdy hlavnφ strßnku ukßzky obnovφte.

Ukßzky do f≤ra a do knihkupectvφ jsou voleny zßm∞rn∞, proto₧e zde se ukß₧e, ₧e u₧ivatel p°i vhodn∞ navr₧enΘ aplikaci nep°ijde o p°ihlßÜenφ nebo o obsah koÜφku. Pozorujte takΘ chovßnφ p°i aktivnφm blokovßnφ vyskakovacφch oken - nap°φklad v Microsoft Internet Exploreru na Windows XP sice problikne ikonka blokovanΘho okna, avÜak mφsto nehezkΘho chybovΘho hlßÜenφ o zablokovanΘm novΘm okn∞ se odkazovanß strßnka zobrazφ v hlavnφm okn∞.

Nejprve si uka₧me odkaz pro otev°enφ "chytrΘho" novΘho okna:

NovΘ okno je otvφrßno funkcφ OpenMyWin(). Funkce vracφ hodnotu "true", pokud se novΘ okno poda°ilo otev°φt nebo je ji₧ otev°enΘ okno ·sp∞Ün∞ "ovlßdßno". Negovanou hodnotu nechßvßme klφΦov²m slovem return probublat a₧ na ·rove≥ odkazu - pokud se tedy novΘ okno nepoda°φ otev°φt (klient mß nap°φklad blokovanΘ otvφrßnφ nov²ch oken), odkaz zafunguje klasick²m zp∙sobem, tak₧e nßÜ dopln∞n² skript nezp∙sobφ v naÜem webu bariΘru.

P°φklad strßnky s funkcφ, kterß jen zamezφ zav°enφ okna a upozornφ u₧ivatele (₧ßdnΘ p°idanΘ testovßnφ, zda zobrazit Φi nezobrazit varovßnφ, zde nenφ):

Ve skriptu si deklarujeme prom∞nnou myTWin - v tΘ budeme dr₧et objekt otev°enΘho okna po tom, co novΘ okno otev°eme.

Ve funkci OpenMyWin()si p°ipravφme nßvratovou hodnotu - p°edpoklßdßme, ₧e se vÜe zda°φ, inicilizujeme ji tedy s hodnou true. Dßle otestujeme, zda prom∞nnß myTWin, odkazujφcφ na objekt okna, nenφ "null". Pokud nenφ (okno ji₧ d°φve bylo otev°eno), otestujeme, jestli okno nebylo mezitφm zav°eno - mß vlastnost closed. Pokud je okno otev°eno, je k dispozici, pak ho p°esuneme do pop°edφ metodou focus() a jako novou URL nastavφme location.href okna na "href" p°edanΘho odkazu "link".

Pokud okno nenφ otev°eno (nebylo otev°eno nebo bylo ji₧ zav°eno), pak prost∞ otev°eme novΘ okno metodou window.open(). V²sledek otev°enφ je p°edßn do prom∞nnΘ myTWin - otestujeme, zda nenφ null nebo odkaz na objekt nenφ typu undefined. Pokud je odkaz null nebo undefined, je z°ejmΘ, ₧e se novΘ okno nezda°ilo otev°φt - klient mß pravd∞pdobn∞ aktivnφ blokßtor vyskakovacφch oken (jako nap°φklad Google/Yahoo toolbar, rozÜφ°enφ MSIE6 ve Windows XP SP2 nebo zßkaz otvφrßnφ nov²ch oken v prohlφ₧eΦφch FireFox, Opera a dalÜφch). V tomto p°φpad∞ s nov²m oknem nelze pracovat, pouze nastavφme nßvratovou hodnotu na false.

Pokud je odkaz na objekt okna korektnφ, m∙₧eme s oknem pracovat. Pro jistotu m∙₧eme nastavit ji₧ zmi≥ovan² target, pou₧ijeme stejnou hodnotu jako pro nßzev okna. Dßle p°eneseme okno do pop°edφ metodou focus(). Toto p°enesenφ je d∙le₧itΘ - m∙₧e se toti₧ stßt, ₧e mate°skΘ okno n∞kdo obnovφ nebo v n∞m p°ejde na jinou strßnku a tφm ztratφ obsah prom∞nnΘ myTWin. Okno s nßzvem "_MyWin" m∙₧e ale b²t stßle otev°enΘ na pozadφ, tak₧e odkaz by se zobrazil v n∞m a u₧ivatel majφcφ hlavnφ okno v pop°edφ by toto nemusel zaregistrovat.

Jako nßvratovou hodnotu funkce tedy nakonec p°edßme hodnotu udßvajφcφ, zda se novΘ okno zda°ilo otev°φt. Tato nßvratovß hodnota, jak ji₧ bylo uvedeno, slou₧φ k potlaΦenφ nebo naopak provedenφ p∙vodnφ funkce odkazu. M∙₧eme si tak b²t jisti, ₧e se klient na strßnku odkazovanou do novΘho okna dostane alternativn∞ v tΘm₧e okn∞, pokud mß vyskakovacφ okna blokovanß.

JeÜt∞ d∙kladn∞jÜφ °eÜenφ by p°edpoklßdalo zamezit ztrßt∞ obsahu myTWin - to by bylo mo₧nΘ umφst∞nφm skriptu do nad°φzenΘho rßmce (s ohledem na p°φstupnost velmi nevhodnΘ), nebo do n∞jakΘho t°etφho okna, kterΘ by na prochßzenφ strßnek v hlavnφm okn∞ nebylo zßvislΘ.

V Φßsti k≤du funkce, kde zjistφme, ₧e je okno otev°enΘ, a nastavujeme novou adresu okna, by bylo mo₧nΘ otestovat, zda se aktußlnφ adresa okna rovnß tΘ, kterou chceme nastavit. Pokud by adresy byly rovny, nastavenφ location.href bychom neprovedli - pouze bychom p°enesli okno do pop°edφ. Volba postupu zßvisφ na aplikaci - v n∞kter²ch aplikacφch je toto "nenastavenφ adresy" ne₧ßdoucφ (u₧ivatel mohl v onom okn∞ nejmΘn∞ jednou odeslat n∞jak² formulß° metodou POST - adresa je tedy stejnß, ale obsah strßnky ne), v jin²ch aplikacφch je velmi vhodnΘ, proto₧e tak u₧ivateli nap°φklad nezmizφ obsah rozepsanΘho p°φsp∞vku ve formulß°i. Naopak do otvφranΘho okna m∙₧eme doplnit upozorn∞nφ p°ed zav°enφm okna.

Jak vidφte, skript neobsahuje ₧ßdnΘ konfigurovatelnΘ hodnoty - tak, jak le₧φ a b∞₧φ, jej ihned m∙₧ete zaintegrovat do libovolnΘ aplikace a odkaz∙ v nφ pou₧it²ch, jen si je pot°eba u ka₧dΘho odkazu promyslet nßzev otvφranΘho okna. Odkazy se stejn²m nßzvem okna budou otvφrßny do tΘho₧ okna.

Na zßv∞r si zapamatujme, ₧e ohleduplnΘ chovßnφ novΘho okna m∙₧eme dnes zajistit pouze klientsk²m skriptem - nepou₧φvejme proto k otvφrßnφ novΘho okna v ₧ßdnΘm p°φpad∞ atribut target, a to ani tehdy, pokud Doctype naÜeho dokumentu tento atribut podporuje.

Pozn. red.: Tento Φlßnek vyÜel poprvΘ 23. 7. 2004. P∙vodnφ verze Φlßnku a k n∞mu vedenΘ diskuse jsou vßm k dispozici v ZIP archivech.

Vyhledßvßnφ