Jak zjistit obsah prvního nadpisu v Iframe vs. hrášková navigace

Fórum › JavaScript, AJAX, jQuery

~ Anonymní uživatel
~ 53 příspěvků

18. 1. 2008 #1

Zdravím všechny,
dělám webovou stránku, kde mám tabulku s odkazy a v ní vnořený iframe. Nahoře v tabulce mám skript, který mi podle id body generuje hráškovou navigaci. Tam nebyl problém. Problém nastal, když sem do hráškové navigace, chtěl doplnit text, který potřebuju získat z prvního nadpisu dokumentu načteného do iframu. Odkazy směruju pomocí vlastnosti target do iframu a při události onclick se snažím získat data pro přepis hráškové navigace. Nefunguje mi však zjišťování elementu dle id, protože použiju-li u iframe id - tak stránka nebude validní, použiju-li i atribut name - je sice validni, ale metoda getelementbyid nakonec neslysi ani na jedno. V době kdy se provádí skript pro vypsání hráškové navigace iframe nejspíš ještě není vykreslený - nevím. A teprve kdyby mi tohle fungovalo, jak docílit aby se mi text generovaný skriptem pro hráškovou navigaci přepsal po klinutí na jeden z odkazu. S tím už bych si ale poradil. Může mi prosím Vís někdo pomoci?

příklad:
<html>
<head>

<script type="text/javascript">


</script>

</head>
<body>
<div id="navigace">/*zde je ten skript pro navigaci ve foru*/</div>
<iframe id="textframe" src="stary.html" ></iframe>
</body>

<a href="novy.html" target="textframe" onclick="Report-h2()"></a>
<a href="novejsi.html" target="textframe" onclick="Report-h2()"></a>
</html>

Nahlásit jako SPAM

IP: 160.217.217.–

CommanderZ 0

Boss

18. 1. 2008 #2

Ja bych jen tak od pohledu videl dva problemy:

1) Pomlcka v nazvu promenne a funkce? Wtf? Hadej, jak si to ten interpreter asi vyklada ;)
2) bacha, abyses nesnazil pristupovat k DOM stranky ulozene na jine domene, to prohlizece blokuji.

A to s tim jeste neni vykresleny mas taky pravdu. Existuje hned nekolik metod, jak zjistovat, jestli uz je DOM nactena (mam pocit ze document objekt toho dokumentu v tom pripade vraci 0, nebo tak neco. A ty to musis periodicky testovat). Ja s tim ale vzdycky mel docela problemy a tak jsem si zvyknul k tomu pristupovat trochu inverzne - do te stranky, kterou nacitas do toho iframu, vlozis onload skript, ktery zavola nejakou funkci z toho vnejsiho framu a ta uz ti potom aktualizuje ten tvuj titulek.

Nahlásit jako SPAM

IP: 81.30.238.–

Prosím, jestli potřebujete s něčím poradit,zeptejte se na fóru. Jakýkoliv bezdůvodný pokus mě kontaktovat skončí okamžitým přidáním do ignore listu![br][br] Současný počet osob, které to nepochopily: 7

Jouda

~ Anonymní uživatel
~ 53 příspěvků

18. 1. 2008 #3

To CommanderZ :

díkez, pravda ze indetifikatory sem si narychlo do tohohle fora vymyslel a uplne na to zapomel. Stranky mam zatim na disku, takze domenama to nebude, s tim nacitanim sem si to myslel. Dat to do onload iframu udalosti me napadlo, jen sem neveril ze skript z podstranky muze volat neco v nadrazene strance...

Nahlásit jako SPAM

IP: 160.217.217.–

Jouda

~ Anonymní uživatel
~ 53 příspěvků

19. 1. 2008 #4

To CommanderZ : Mam ještě dotaz, ten skript který chci umístit do onload udalosti toho iframu musí být umístěn v tom html zdroji toho iframu? Nebo kdekoli v nadřazeném dokumentu? Protože pakliže by byl v hlavním html, jak by potom mohl jednoduše přistoupit k tagům jiného html v iframe? A když do skriptu v html iframu umístím volání funkce nadřazeného dokumentu, bude ji znát? Sorry sem v tomhle nováček, v delfách bych si věděl rady..

Nahlásit jako SPAM

IP: 160.217.217.–

CommanderZ 0

Boss

19. 1. 2008 #5

Samozrejme, ze musi byt v body tagu toho iframu, pak budes akorat volat parent.nazevfunkce();

Nahlásit jako SPAM

IP: 81.30.238.–

CommanderZ 0

Boss

19. 1. 2008 #6

Btw, ty tim

        var varFrame = document.getElementById(WhichFrame); 

      var text-h2 = varFrame.document.all.h2[0]; //všude píšou něco jiného nefachá však nic 

        //.... dal nevim 

      alert(text-h2);

Akorat vypises informaci i identifikatory DOM zdroje. Pokud chces vypsat/upravit obsah toho H2, tak musis pouzit innerHTML.

Nahlásit jako SPAM

IP: 81.30.238.–

Jouda

~ Anonymní uživatel
~ 53 příspěvků

19. 1. 2008 #7

To CommanderZ : Zkoušel sme to přes opener a tak podobně a nakonec jsem se mi to podarilo rozchodit přes ten parent.fce(); Moc díky za radu. Solution has been found..

Nahlásit jako SPAM

IP: 160.217.217.–

Petroff0

Věrný člen

22. 1. 2008 #8

To Jouda : Chyba v logice provádění: <a href="novy.html" target="textframe" onclick="Report-h2()"></a>
Nejdříve se zavolá funkce Report a teprve po jejím ukončení se začne načítat stránka.
To CommanderZ :
Vidím maličkou nevýhodu. Do každé stránky (načítané do iframe) musíš vložit skript pro komunikaci s tou hlavní.
Nešlo by to udělat tak, aby se o všechno postaral script v hlavní stránce? Šlo.
Uvádím hlavní soubor i ty dva co se načítají do IFRAMU (jeden z nich pomocí JS simuluje stránku kt. se dlouho načítá)

<html><head><title>MAIN</title>

<script>

/****** funkce Report obdrží text nadpisu H2 *****/

var fW; function Report(txt){ alert(txt) }



function cekej(){

 var pole=fW.document.getElementsByTagName("h2");

 if(pole.length) Report(pole[0].innerHTML);

 else setTimeout(function(){cekej()},10);

}

function predejH2text(e){

 fW = frames.textframe;

 fW.location = e.href;

 setTimeout(function(){cekej()},100)

}

</script>

</head>

<body>

<iframe  id="id_iframu" name="textframe" src="about:blank"></iframe>

<p>

<a href="novy-static.html" onclick="predejH2text(this);return false">

  Kratka stranka - staticky nadpis</a>

</p>

<p>

<a href="novy-dynamic.html" onclick="predejH2text(this);return false">

  Dlouha stranka - generovany nadpis</a>

</p>

</body>

</html>

------------------------------------> novy-static.html

<html><head><title>h2=static</title>

</head>

<body>

<div id="page">

<h2>Seznamte se s H2 static</h2>

</div>

</body>

</html>

------------------------------------> novy-dynamic.html

<html><head><title>h2=dynamic</title>

<script>

var pomaluj = function(x){

var page=document.getElementById("page");

if(x>0) {page.innerHTML+=x+". ooooooooooooooooo<br>"; setTimeout(function(){pomaluj(--x)},50);}

else page.innerHTML="<h2>Seznamte se s H2 dynamic</h2>"+page.innerHTML;

}

</script>

</head>

<body>

<div id="page"></div>

<script>

pomaluj(20)

</script>

</body>

</html>

A nakonec pár důležitých údajů - hlavně vztahů mezi rámcem a hl.dokumentem
Jak načíst soubor do rámce:
1. <a href="novy.html" target="textframe">xxx</a>
2. window.open("novy.html","textframe")
3a. winIF.location = "novy.html"
3b. winIF.location.replace("novy.html")
4. elemIF.src = "novy.html"
-------------------------------------------
<iframe id="idIF" name="textframe" src=""></iframe>
--------------------------------------------
name je název okna(=objektu window) v iframu
id je identifikátor objektu iframe
src je URL souboru v rámci
--------------------------------------------
hlavní okno: win = window (=self=frames) = winIF.parent = winIF.content
URL hl.souboru: fMain = win.location = doc.location (location == location.href)
hlavní dokument: doc = win.document = elemIF.ownerDocument

objekt iframe: elemIF = doc.getElementById("idIF") = winIF.frameElement

objekt window uvnitř iframu: winIF = elemIF.contentWindow = docIF.defaultView
[tentýž pomocí jména="FirstFr"] = win.FirstFr = win["FirstFr"] = win[0]
URL souboru v rámci: fChild = winIF.location = elemIF.src
jméno IFokna: jmeno = winIF.name
objekt document uvnitř iframu: docIF = elemIF.contentDocument = winIF.document

Nahlásit jako SPAM

IP: 89.102.96.–

CommanderZ 0

Boss

22. 1. 2008 #9

Vzyt ja rikal ze to tak zhruba jde.

Btw, ten tvuj zpusob je docela dost pochybnej. Napriklad stranka bez H2 ho docela knokautuje. On je nejaky zpusob, jak zjistit, jetsli uz je DOM kompletne nactena, ja si jenom nepamatuju teb presny prikaz na to - a hledat se mi to nechce.

Nahlásit jako SPAM

IP: 81.30.238.–

Jouda

~ Anonymní uživatel
~ 53 příspěvků

22. 1. 2008 #10

To Petroff : Díky moc, rozchodil jsem to dle rady CommandraZ rady, pravda je že skript musí bejt v kžzdy podstránce uvnitř. Slyšel sem i něco o vyřazení iframu z budoucího xhtml. Což je skoda, pro určitý věci je to dost šikovná věc.

Netusil sem, ze existuje id_neco.location.replace - to mi značne ulehčuje práci. To jestli stranka má h2 nebo ne, je něco co sem chtě uvýst jako příkladl, dle čeho chci získat titulek, kdyz nemá, což muze bejt taky nutnej připad - nenačte se nic, ošetřím-li to vhodnou podminkou.

Stranky se však stejne dovršily do bodu, kdy je budu muset předelat. Comanderův zpusob má tu nevyhodu, ze se načítáni provadi vlastne dvakrát a blikne to. Způsob 2. má navíc tu výhodu, že můžu z hlavní stránky skrze odkaz poslat 2 odkazy a to ktere se má načíst jako hlavni i ktere do iframu/případ že budu mít odkaz na nějakou novinku v podsekci/. Druhým způsobem bych informaci asi musel uchovat v pod-html souborech, což by byla zbytečná práce.

Každopádně děkuju Vám oběma, moc jste mi pomohli..

Nahlásit jako SPAM

IP: 160.217.217.–

Petroff0

Věrný člen

23. 1. 2008 #11

To CommanderZ :
Samozřejmě že bez H2 by nefungovala - dyť je dělaná na stránky s H2, bez nich by toho nefungovalo více - drobečková navigace ...
(A držím ti palce v hledání vlastnosti,kt. ukazuje stav načtení stránky. Znám totiž jen jednu - object.readyState ale ta funguje jen v IE)
Není problém to ošetřit => tahle verze je opravená, počítá i s event.prodlevou na lince, a pokud stránka hledaný prvek (H2) neobsahuje, poskytne alternativní string ( "actual").
[Oproti onload další výhody: nečeká až do úplného načtení stránky, nevadí ji pokud má stránka vlastní ovladač onload - např.generovaný nějakým skriptem]

<html><head><title>MAIN</title>

<script>

var fW,fDoc; 

 function Report(txt){ alert(txt) }  

 function LoadERROR(txt){ alert("Stranka se nenacetla") }



function pocetPrvku(old) {

 if(fDoc.body) return fDoc.body.innerHTML.length;

 if(fDoc.all) return fDoc.all.length;

 if(fDoc.getElementsByTagName) return fDoc.getElementsByTagName("*").length;

 return old;

}

function cekej(prvku){

 fDoc = fW.document;

 var nxtprvku = pocetPrvku(prvku);

 if (!nxtprvku) nxtprvku=prvku+1;

 var pole = fDoc.getElementsByTagName("h2");  /* ZDE SE UMÍSTÍ TESTOVÁNÍ VÝSKYTU PRVKU */

 if(pole.length) Report(pole[0].innerHTML);         /*  ČTENÍ VLASTNOSTI A ZAVOLÁNÍ FUNKCE REPORT   */

 else if (prvku==nxtprvku) Report("Actual");       /*  VOLÁNÍ REPORT S HODNOTOU  ~ NENALEZENO  */

 else if (!prvku) LoadERROR(fW.location.href);     /*  PRÁZDNÁ STRÁNKA tj. <body></body> */

 else setTimeout(function(){cekej(nxtprvku)},100);

}

function predejH2text(e){

 fW = frames.textframe;

 fW.location = e.href;

 setTimeout(function(){cekej(-10)},100)    /* -10 znamená čekej 10 cyklů, jestli se přece jen stránka nezačne nahrávat  */

}                                                                /* pak ukonči (případně zavolej ERROR funkci)  */

</script>

</head>

<body>

<iframe  id="id_iframu" name="textframe" src="about:blank"></iframe>

<p>

<a href="novy-static.html" onclick="predejH2text(this); return false">

         Kratka stranka - staticky nadpis</a></p>

<p>

<a href="novy-dynamic1.html" onclick="predejH2text(this); return false">

         Dlouha stranka - generovany nadpis na začátku</a></p>

<p>

<a href="novy-dynamic2.html" onclick="predejH2text(this); return false">

         Dlouha stranka - generovany nadpis na konci</a></p>

<p>

<a href="novy-bezh2.html" onclick="predejH2text(this); return false">

         Stranka bez H2 nadpisu</a></p>

<a href="about:blank" onclick="predejH2text(this); return false">

         Stranka bez obsahu</a></p>

</body>

</html>

---------stejný jako předtím--------> novy-static.html 

------------------------------------> novy-dynamic1.html

<html><head><title>h2=dynamic</title>

<script>

var pomaluj = function(x){

var page=document.getElementById("page");

if(x==35) page.innerHTML+="<h2>Seznamte se s H2 dynamic</h2>";

if(x>0) {page.innerHTML+="Tato stranka se nyni nahrava.".split(" ")[(50-x)%5]+" ";

setTimeout(function(){pomaluj(--x)},80);}

}

</script>

</head>

<body>

<div id="page"></div>

<script>

pomaluj(40)

</script>

</body>

</html>

------------------------------------> novy-dynamic2.html

<html><head><title>h2=dynamic</title>

<script>

var pomaluj = function(x){

var page=document.getElementById("page");

if(x>0) {page.innerHTML+="Tato stranka se nyni nahrava.".split(" ")[(50-x)%5]+" ";

setTimeout(function(){pomaluj(--x)},80);

} else page.innerHTML+="<h2>Seznamte se s H2 dynamic</h2>";

}

</script>

</head>

<body>

<div id="page"></div>

<script>

pomaluj(20)

</script>

</body>

</html>

------------------------------------------> novy-bezh2.html

<html><head><title>Bez H2 [dynamic]</title>

<script>

var pomaluj = function(x){

var page=document.getElementById("page");

if(x>0) {page.innerHTML+="Tato stranka se nyni nahrava.".split(" ")[(50-x)%5]+" ";

setTimeout(function(){pomaluj(--x)},80) }

}

</script>

</head>

<body>

<div id="page"></div>

<script>

pomaluj(30)

</script>

</body>

</html>

Pozn.: testoval jsem to ve FF (doufám že v ostatních browserech to jede taky)

Nahlásit jako SPAM

IP: 89.102.96.–

Petroff0

Věrný člen

23. 1. 2008 #12

To Jouda : promiň malou chybku - spletl jsem si replace a reload, už jsem to opravil
výňatek z http://home.pf.jcu.cz/~pepe/Diplomky/Marek/html/uvod.html

Objekt Location
Objekty Location reprezentují adresy dokumentů natažených do oken prohlížečů, objekty jsou přístupné pomocí vlastnosti location objektů window. Natažení dokumentu do okna prohlížeče způsobíme jednoduše přiřazením nové hodnoty do vlastnosti location daného okna:

window.location = "www.seznam.cz"

Metody objektů Location
reload([logický_výraz]) – metoda způsobí znovunatažení dokumentu do okna prohlížeče bez ohledu na nastavení cache paměti prohlížeče pokud má logický_výraz hodnotu true, pokud má logický_výraz hodnotu false, řídí se znovunatažení dokumentu podle konfigurace paměti cache prohlížeče:
window.location.reload(true)

replace(řetězcový_výraz) – metoda způsobí natažení dokumentu s adresou specifikovanou jako parametr metody do okna prohlížeče a zároveň přepíše aktuální položku historie obsazení okna:
window.location.replace("http://www.seznam.cz")