Javascript napříč okny prohlížeče
Martin Kopta, vydáno/aktualizováno: 10.9.2001/19.01.2002
V souvislosti s rámy existují dva případy, kdy nám může být javascript velmi nápomocen při uchovávání konzistence obsahu okna prohlížeče. Jedním z těch případů je ochrana před vložením naší stránky do cizí rámové struktury, druhý případ nastává v okamžiku, kdy chceme zajistit, aby se za každé okolnosti do okna načetla úplná rámová struktura s obsahem rámů v patřičném kontextu.
První případ je jednodušší, a proto se mu budeme věnovat dříve. Představte si situaci, kdy jiný autor internetových stránek udělá chybu při směrování odkazu z rámové struktury a vaše stránka se nedopatřením načte do některého rámu v okně. Bylo by skvělé, kdybyste mohli stránce nadefinovat předvolbu, která načtení do cizího rámu zabrání.
Pokud dotyčná stránka nepatří do rámové struktury, pak je řešení jednoduché:
<script type="text/javascript">
<!--
if(window.top != window.self) {
window.top.location.href = window.self.location;
}
-->
</script>
Podmínkou ověřujeme, zda objekt window.top
je týž jako window.self
. Pokud je v okně top načten jiný obsah než v okně self, script načte do okna nejvyšší úrovně obsah právě aktuálního rámu.
Podobným způsobem můžeme ověřit i správnost načtení dokumentu do rámu ve správném kontextu:
==============================[x]==
| menu | zahlavi |
| |------------------------|
| | obsah |
| | |
| | |
| | |
| | |
+---------------------------------+
Pokud potřebujeme zjistit, zda se rám top.obsah
načetl zárověň s rámy top.menu
a top.zahlavi
se spravným dokumentem, opět k tomu můžeme použít javascript:
<script type="text/javascript">
<!--
menu_url = "http://www.server.cz/menu.html" ;
zahlavi_url = "http://www.server.cz/zahlavi.html" ;
frameset_url = "http://www.server.cz/frameset.html" ;
menu_loc = top.frames["menu"].location;
zahlavi_loc = top.frames["zahlavi"].location;
if((menu_loc != menu_url) || (zahlavi_loc !=
zahlavi_url)) {
top.location.href = frameset_url;
}
--> </script>
Někdy se ale mění obsah více oken, a proto je nevhodné volat pro aktualizaci statický dokument frameset.html
-- museli bychom mít pro každou situaci samostatný definiční soubor rámové struktury. Tehdy je vhodné spojit javascript na straně klienta a nějakým skriptem na straně serveru. Takovému skriptu na serveru pak můžete jen odeslat URL na patřičný kontext:
<?php
// výchozí hodnoty URL
if(!$menu) {
$menu = "http://www.server.cz/menu.html" ;
} else {
$menu = urldecode($menu);
}
if(!$zahlavi) {
$zahlavi = "http://www.server.cz/zahlavi.html" ;
} else {
$zahlavi = urldecode($zahlavi);
}
if(!$obsah) {
$obsah = "http://www.server.cz/obsah.html" ;
} else {
$obsah = urldecode($obsah);
}
?>
<frameset cols="20%,*">
<frame name="menu" src="<?php echo $menu; ?>">
<frameset rows="20%,*">
<frame name="zahlavi" src="<?php echo $zahlavi;?>">
<frame name="obsah" src="<?php echo $obsah; ?>">
</frameset>
</frameset>
V první fázi jsme nastavili výchozí URL, který se použije, pouze pokud nebude žádný jiný specifikován. Na tento dokument pak můžeme buď udělat odkaz ve stylu:
<a href=
"/frameset.php?menu=/menu.html&zahlavi=/zahlavi.html">
ODKAZ
</a>
Takový odkaz se hodí především pro záložky, případně jej můžeme použít pro automatické přesměrování v javascriptu:
<script type="text/javascript">
<!--
// umístění dokumentů v kontextu rámů
menu_url = "http://www.server.cz/menu.html" ;
zahlavi_url = "http://www.server.cz/zahlavi.html" ;
obsah_url = "http://www.server.cz/obsah.html" ;
// objekty rámů
menu_loc = top.frames["menu"].location;
zahlavi_loc = top.frames["zahlavi"].location;
obsah_loc = top.frames["obsah"].location;
// konstrukce odkazu
frameset_url = "http://www.server.cz/frameset.php" ;
frameset_url += "?menu=" + encode(menu_url);
frameset_url += "&zahlavi=" + encode(zahlavi_url);
frameset_url += "&obsah=" + encode(obsah_url);
if((menu_loc != menu_url)
|| (zahlavi_loc != zahlavi_url)
|| (obsah_loc != obsah_url)) {
top.location.href = frameset_url;
}
-->
</script>
Pokud se v odkazu mají objevit nějaké znaky se zvláštním významem (:/@?&)
, je nutné nejdříve je převést na sekvenci %nn, což v javascriptu zajišťuje funkce encode();
v programu PHP pak naopak tyto sekvence musíme převést zase zpět, k čemuž nám dopomůže funkce urldecode()
.
Ukázali jsme si několik postupů, jak pomocí javascriptu snáze udržet soudržnost obsahu rámu s jeho okolím. Určitě vás napadne několik dalších způsobů využití, a já věřím, že po přečtení minulého a dnešního tutorialu si patřičné funkce zvládnete upravit sami. Jen prosím mějte na paměti, že javascript je tu k usnadnění ovládání webu pro uživatele, rozhodně byste jej nikdy neměli použít samoúčelně, nebo dokonce tak, aby vytvářel překážky.
© 2001 Martin Kopta, Lupa