Jak do ramy (nie iframe) zawartość z jQuery

Question

mam 2 ramek w jedną stronę, jak to (/home.html)

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

a następnie w jednej ramce (treeStatus.html) I mieć coś takiego jakChcę z górnego okna manipulować div znajdującym się w ramce podrzędnej poprzez jquery (np. pokaż i ukryj).

Widziałem severalquestionslikethis i sugerują następujące

$(document).ready(function(){ 

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

ja nie wiem, czy to działa z iframe, ale w moim przypadku, gdy mam proste ramki nie wydają się działać. Kod jest umieszczony wewnątrz strony home.html

Oto wyjście z konsoli firebug

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

Więc jak mam dostęp do elementów ramowych z górnej ramki? Czy coś mi umyka?

Odpowiedź

Po połączeniu obu odpowiedzi tutaj, prawidłowy sposób jest

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

Aby to działało rama musi mieć nazwę atrybut oprócz id, tak:

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

Answer 1

Można pobrać ramkę i div, które chcesz manipulować i przekazać go do zmiennej.

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

Następnie można zrobić wszystko, co chcesz, za pośrednictwem jQuery.

$(statusText).whatever(); 

Choć czasami po prostu nie można ominąć konieczności korzystania z ramek, należy pamiętać, że znacznik <frame> jest zastąpiony w HTML5. Jeśli kiedykolwiek planujesz przejść na HTML5, musisz użyć iFrame.

Answer 2

Musisz podać odniesienie do ramki, którą masz Aby uzyskać dostęp:

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

Answer 3

Mam ramki zagnieżdżone.W moim przypadku, aby to działało użyłem komendy:

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

Potem, jak Charles już odpowiedział, można zrobić wszystko, co chcesz do niego poprzez jQuery:

$(statusText).whatever(); 

Answer 4

https://jamesmccaffrey.wordpress.com/2009/07/30/cross-frame-access-with-jquery/

$(document).ready(function(){ 
    $("#Button1").click(function(){ 
     $(parent.rightFrame.document).contents().find(‘#TextBox1’).val(‘Hello from left frame!’); 
    }); 
    }); 

Ale użyłem:

$.post("content_right.php",{id:id},function(data) 
    $(parent.frames["content_right"].document.body).html(data) ; 
    }); 

Answer 5

Dla czystego roztworu jquery (który nie wymaga top.frames etc), następujące wydaje się działać:

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

Ma to tę zaletę, że działa dla zagnieżdżonych ramek:

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