2012-08-24 15 views
7

Mam stronę z ramką iframe zawierającą dokument HTML. Muszę uzyskać dostęp do identyfikatora elementu iframe z tego dokumentu podrzędnego i nie mam szczęścia, aby uzyskać do niego dostęp za pomocą jQuery. Zasadnicza struktura jest to w moim strony:Pobieranie elementu nadrzędnego elementu iframe dokumentu w jQuery

<div id="ContainingDiv"> 
    <iframe id="ContainingiFrame"> 
    <html> 
    <head></head> 
    <body> 
    </body> 
    </html> 
    </iframe> 
</div> 

W moim javascript metody mogę dostać się do czegokolwiek w <body> tagów za pomocą selektorów jQuery, ale nie można pobrać elementu iframe, aby go zmienić. Próbowałem kilku rzeczy, ale nie jestem wprawdzie ekspertem od nawigacji DOM jQuery, szczególnie w przypadku elementów iframe (element iframe znajduje się w tej samej domenie co strona zawierająca). Czy jest jakiś sposób, aby to zrobić?

+0

Co robisz oznacza "element iframe", element iframe z identyfikatorem 'ContainingiFrame' lub elementem wewnątrz elementu iframe. Co dokładnie próbujesz zmienić? – adeneo

+0

adeneo, interesuje mnie sama ContainingiFrame. Poniżej uzyskałem doskonałe odpowiedzi i chciałbym móc je wszystkie przyjąć. – larryq

Odpowiedz

17

Nie potrzeba jQuery w ogóle. Aby uzyskać obiekt ciała rodzica, można to zrobić:

var parentBody = window.parent.document.body 

Jeśli jest w tej samej domenie co iframe, które są uruchomione kod, skoro masz to, można użyć zwykłego java na ten temat obiekt:

window.parent.document.getElementById("ContainingiFrame").style.height = "400px"; 

lub z jQuery:

$("#ContainingiFrame", parentBody).height("400"); 

Oto artykuł na temat zmiany rozmiaru iframe od wewnątrz iframe z przykładowy kod: http://www.pither.com/articles/2010/11/12/resize-iframe-from-within

I powiązany pytanie/odpowiedź na zmiany rozmiaru iframe na podstawie jego własnych treści: Resizing an iframe based on content

+0

Szukam tej informacji przez ponad 2 godziny; działa dla moich wysiłków – MiBol

1

Spróbuj tego:

Resize jakiś element wewnątrz iframe:

$('#ContainingiFrame', window.parent.document).find('#someDiv').css('height', '200px'); 

Lub po prostu zmienić rozmiar iframe:

$('#ContainingiFrame', window.parent.document).height('640'); 
0

Spróbuj tego:

$("#ContainingiFrame").contents().find("#someDiv"); 
9

Aby dostęp dokumentu rodzica z iframe można dodać parametr do selektorów, domyślnie jest to dokument, ale nic nie uniemożliwia zmianę kontekstu window.parent.document tak:

$('#ContainingiFrame', window.parent.document).whatever(); 

lub dodaj przed selektora:

window.parent.$('#ContainingiFrame').whatever(); 
4

Jeżeli nie posiadamy informacji o iframe (takie jak identyfikator do frazę), a następnie chcesz użyć frameElement okna następujące:

var iframe_tag_in_parent_window = window.frameElement; 

teraz musisz sam tag iframe i można z nim pracować bezpośrednio w JavaScript.

użyć jQuery zamiast zwykłego JavaScript, należy użyć następujących:

var iframe_in_jquery = jQuery(window.frameElement, window.parent.document); 

Właśnie rozmawialiśmy o pierwszej części (window.frameElement). Druga część to kontekst, w którym jQuery znajdzie element i zawinie go. To jest dokument nadrzędny naszego bieżącego okna.

Na przykład, jeśli masz unikalny identyfikator w tagu iframe można zrobić:

var iframe_in_jquery = jQuery(window.frameElement, window.parent.document), 
    id = iframe_in_jquery.attr("id"); 

Teraz id jest identyfikatorem jeśli iframe kod JavaScript działa na.


P.S. jeśli window.frameElement ma wartość null lub jest niezdefiniowana, oznacza to, że nie należysz do użytkownika iframe.

P.P.S zauważ, że aby uruchomić kod w oknie nadrzędnym, konieczne może być użycie instancji nadrzędnej: jQuery(); odbywa się to przy użyciu window.parent.jQuery(...). Jest to szczególnie ważne, jeśli spróbujesz zdarzenie trigger()!

P.P.P.S. upewnij się, że używasz window.frameElement i nie tylko frameElement ... niektóre przeglądarki są nieco uszkodzone i nie zawsze będą w stanie uzyskać dostęp do poprawnych danych, jeśli nie są w pełni kwalifikowane (chociaż w 2016 r. problem ten może zostać rozwiązany?)

+1

Ya, frameElement naprawdę pozwala nam uzyskać okno kontenera ramek bez znajomości id lub czegoś. Nie wiem, kiedy ta właściwość jest ważna, ale mdn mówi, że może być używana w bardzo wczesnych przeglądarkach. – Eric

Powiązane problemy