Come accedere a Iframe padre da JavaScript

Question

Bene, ho un IFrame, che chiama una stessa pagina di dominio. Il mio problema è che voglio accedere ad alcune informazioni da questo genitore Iframe da questa pagina chiamata (da JavaScript). Come posso accedere a questo Iframe?

Dettagli: ci sono diversi iframe come questo, che possono avere la stessa pagina caricata, perché sto programmando un ambiente Windows. Ho intenzione di chiudere questo Iframe, ecco perché ho bisogno di sapere quali dovrei chiudere da dentro di lui. Ho una matrice che mantiene i riferimenti a questi Ifram.

EDIT: Non ci iframe vengono generati dinamicamente

Answer 1

è possibile utilizzare parent per accedere alla pagina principale. Quindi, per accedere a una funzione sarebbe:

var obj = parent.getElementById('foo'); 

Answer 2

Prova questa, nel frame genitore impostare voi IFRAME come questo:

<iframe id="frame1" src="inner.html#frame1"></iframe> 
<iframe id="frame2" src="inner.html#frame2"></iframe> 
<iframe id="frame3" src="inner.html#frame3"></iframe> 

Nota che l'ID di ogni fotogramma è passato come un ancoraggio in lo src.

poi nel tuo html interna è possibile accedere l'id del fotogramma viene caricato in via location.hash:

<button onclick="alert('I am frame: ' + location.hash.substr(1))">Who Am I?</button> 

allora si può accedere parent.document.getElementById() per accedere al tag iframe da all'interno del iframe

Answer 3

Inoltre è possibile impostare nome e l'ID a valori pari

<iframe id="frame1" name="frame1" src="any.html"></iframe> 

in modo da essere in grado di utilizzare il codice seguente all'interno pagina figlio

parent.document.getElementById(window.name); 

Answer 4

Vecchia domanda, ma ho appena avuto lo stesso problema e ho trovato un modo per ottenere l'iframe. Si tratta semplicemente di iterare attraverso l'array frames [] della finestra genitore e testare il contenuto di WindowWindow rispetto alla finestra in cui è in esecuzione il codice. Esempio:

var arrFrames = parent.document.getElementsByTagName("IFRAME"); 
for (var i = 0; i < arrFrames.length; i++) { 
    if (arrFrames[i].contentWindow === window) alert("yay!"); 
} 

Oppure, utilizzando jQuery:

parent.$("iframe").each(function(iel, el) { 
    if(el.contentWindow === window) alert("got it"); 
}); 

Questo metodo salva l'assegnazione di un ID a ciascun iframe, che è buono nel vostro caso in quanto vengono create dinamicamente. Non sono riuscito a trovare un modo più diretto, dal momento che non è possibile ottenere l'elemento iframe usando window.parent - passa direttamente all'elemento della finestra genitore (saltando l'iframe). Quindi collegarsi a loro sembra l'unico modo, a meno che tu non voglia usare gli ID.

Answer 5

Forse basta usare

window.parent 

nel vostro iframe per ottenere la convocazione del telaio/finestre. Se tu avessi più cornice di chiamata, è possibile utilizzare

window.top 

Answer 6

// just in case some one is searching for a solution 
function get_parent_frame_dom_element(win) 
{ 
    win = (win || window); 
    var parentJQuery = window.parent.jQuery; 
    var ifrms = parentJQuery("iframe.upload_iframe"); 
    for (var i = 0; i < ifrms.length; i++) 
    { 
     if (ifrms[i].contentDocument === win.document) 
      return ifrms[i]; 
    } 
    return null; 
} 

Answer 7

Basta chiamare window.frameElement dalla pagina incorniciata. Se la pagina non è in una cornice, allora frameElement sarà null.

L'altro modo (ottenendo l'elemento finestra all'interno di un frame è meno banale) ma per ragioni di completezza:

/** 
* @param f, iframe or frame element 
* @return Window object inside the given frame 
* @effect will append f to document.body if f not yet part of the DOM 
* @see Window.frameElement 
* @usage myFrame.document = getFramedWindow(myFrame).document; 
*/ 
function getFramedWindow(f) 
{ 
    if(f.parentNode == null) 
     f = document.body.appendChild(f); 
    var w = (f.contentWindow || f.contentDocument); 
    if(w && w.nodeType && w.nodeType==9) 
     w = (w.defaultView || w.parentWindow); 
    return w; 
} 

Answer 8

volta id iframe è impostato, è possibile accedere iframe dal documento interno come mostrato di seguito.

var iframe = parent.document.getElementById(frameElement.id); 

Funziona bene in IE, Chrome e FF.

Answer 9

Si consiglia di utilizzare postMessage API.

Nella tua iframe, chiamare:

window.parent.postMessage({message: 'Hello world'}, 'http://localhost/'); 

Nella pagina che si sta includendo l'iframe è possibile ascoltare per eventi come questo:

window.addEventListener('message', function(event) { 
     if(event.origin === 'http://localhost/') 
     { 
     alert('Received message: ' + event.data.message); 
     } 
     else 
     { 
     alert('Origin not allowed!'); 
     } 

    }, false); 

Tra l'altro, è anche possibile chiamate ad altre finestre e non solo iframe.

Per saperne di più l'API postMessage su John Resigs blog here