2010-05-27 5 views
26

Ich habe 2 Frames auf einer Seite wie folgt aus (home.html)Wie Rahmen für den Zugriff auf (nicht iframe) Inhalte von jQuery

<frameset rows="50%, 50%"> 
     <frame id="treeContent" src="treeContent.html" /> 
     <frame id="treeStatus" src="treeStatus.html" /> 
</frameset> 

und dann in einem Rahmen (treeStatus.html) I haben so etwas wie

<body style="margin: 0px"> 
<div id="statusText">Status bar for Tree</div> 
</body> 

ich aus dem oberen Fenster will die div in dem Kind Rahmen über jquery (zB Ein- und ausblenden) angeordnet zu manipulieren.

Ich habe severalquestionslikethis gesehen, und sie legen nahe, den folgend

$(document).ready(function(){ 

      $('#treeStatus').contents().find("#statusText").hide(); 
    }); 

Ich weiß nicht, ob dies mit iframes funktioniert, aber in meinem Fall, wo ich einfachen Rahmen es nicht zu funktionieren scheint. Der Code wird innerhalb home.html platziert

Hier einige Ausgabe von Firebug Konsole ist

>>> $('#treeStatus') 
[frame#treeStatus] 
>>> $('#treeStatus').contents() 
[] 
>>> $('#treeStatus').children() 
[] 

Wie greife ich auf Rahmenelemente aus dem oberen Rahmen? Fehle ich hier etwas?

Antwort

Nachdem beide Antworten hier die Kombination der richtige Weg ist

$('#statusText',top.frames["treeStatus"].document).hide(); 

dies für den Rahmen zu arbeiten, müssen die Namen abgesehen von der id-Attribut haben, wie folgt aus:

<frameset rows="50%, 50%"> 
      <frame id="treeContent" src="treeContent.html" /> 
      <frame name="treeStatus" id="treeStatus" src="treeStatus.html" /> 
    </frameset> 
+0

Nur eine Notiz : Warum Frames verwenden, wenn Sie "position: fixed" verwenden könnten, um eine Statusleiste (oder ein Protokoll, das von der Größe vorgeschlagen wird) immer am unteren Rand des Ansichtsfensters hinzuzufügen ... einen alten Browser zu unterstützen? – alex

+0

@alex Dies ist nur ein minimales Beispiel, das ich für stackoverflow erstellt habe. Die reale Anwendung ist völlig anders. Es ist komplizierter als einfache Statusleisten. Frames sind eine Voraussetzung (Fragen Sie nicht!). – kazanaki

+0

OK, keine Sorge. Ich dachte nur, dass ich das hinzufügen würde (einige Leute wissen nicht über "Position: behoben"). – alex

Antwort

11

Sie könnten den Rahmen und div, die Sie manipulieren möchten, greifen und in eine Variable übergeben.

var statusText = top.frames["treeStatus"].document.getElementById('statusText'); 

Dann können Sie alles durch jQuery tun, was Sie wollen.

$(statusText).whatever(); 

Obwohl manchmal kann man einfach nicht Frames benutzen umgehen, denken Sie daran, dass die <frame> Tag in HTML5 veraltet ist. Wenn Sie vorhaben, zu HTML5 zu wechseln, müssen Sie iFrames verwenden.

+0

hinzugefügt. Nicht genau das, was ich wollte, weil ich das glaube Der ganze Zweck von jQuery ist es, getElementById zu vermeiden. Aber deine Antwort hat mir geholfen, das zu tun, was ich will, also akzeptiere ich es. – kazanaki

+0

toller Post Mann, arbeitete wie ein Charme –

5

Sie müssen einen Verweis auf den Rahmen Sie was liefern Zugriff:

$("some selector", top.frames["treeStatus"])) 
+2

Ich habe das versucht und es funktioniert nicht von selbst. Nachdem ich die Antwort von portable gesehen habe, habe ich mit $ ("some selector", top.frames ["treeStatus"] .document)) gearbeitet und auch "treeStatus" als Namen neben id – kazanaki

4

Ich habe Frames verschachtelt.In meinem Fall, um es i Befehl funktioniert:

var statusText = 
top.document.getElementById("treeStatus").contentDocument.getElementById("statusText"); 

Dann wird, wie Charles bereits beantwortet, können Sie alles tun können Sie es durch jQuery wollen:

$(statusText).whatever(); 
+0

contentDocument ist, was ich gesucht habe! Ich habe auch verschachtelte Frames, danke für diesen Beitrag! – NetWave

2

Für eine reine jquery Lösung (das erfordert nicht top.frames usw.), scheint die folgende zu arbeiten:

$('some selector for item from frame' ,$('frame selector')[0].contentDocument) 

Dies hat den Vorteil, dass es für verschachtelten Frames funktioniert:

$('inner frame item selector', $('inner frame selector', $('outer frame selector')[0].contentDocument)[0].contentDocument) 
Verwandte Themen