Accesso alla variabile JavaScript in un iframe, dalla finestra padre sullo stesso dominio

Question

Sono abbastanza nuovo in JavaScript e sto cercando di ottenere il valore di una variabile da un iframe incorporato. Ho fatto ricorso a test di base per assicurarmi di ottenere il metodo giusto ...

Ho provato i suggerimenti comuni e tutto restituisce "indefinito". Voglio usare la variabile in un evento onclick.

Nel contenuto iframe ho spogliato di tutto e solo per la prova avere questo:

<script> 
var test = "test"; 
</script> 

nella finestra padre ho fatto questo:

<iframe src="iframe.html" id="iframe" width="200" height="100"></iframe> 

<script> 
var myVar = window.frames[0].window.test; 
</script> 
<a href="#" onclick='alert(myVar)' id="link">Click</a> 

Ho provato le opzioni suggerite qui: grab global variable from an embedded iframe

Tutto ciò che faccio ritorna indefinito ... sto facendo qualcosa di fondamentalmente sbagliato?

Grazie in anticipo ..

Answer 1

Si sono già in esecuzione lo script quando il è ancora caricando, quindi è test è undefined. Attendere che l'evento del iframe load, o semplicemente ottenere la variabile quando si fa clic:

<iframe src="iframe.html" id="iframe" width="200" height="100"></iframe> 

<script> 
var myFrame = window.frames[0].window; 
</script> 
<a href="#" onclick='alert(myFrame.test)' id="link">Click</a> 

Answer 2

Non stai apparentemente in attesa che il contenuto del frame da caricare prima di accedere myVar. È probabile che l'elemento <script> nel frame non sia stato ancora scaricato o eseguito quando lo fai.

Prova ritardare l'assegnazione di variabili fino a quando il contenuto del telaio è a pieno carico:

<iframe src="iframe.html" id="iframe" onload="frameLoaded();" width="200" height="100"></iframe> 

<script> 
    var myVar; 
    function frameLoaded() { 
     myVar = window.frames[0].window.test; 
    } 
</script> 

Per inciso, dal momento che la tua domanda è contrassegnati jquery vorrei suggerire di scrivere qualcosa di simile:

<iframe src="iframe.html" id="iframe" width="200" height="100"></iframe> 

<script> 
    $("#iframe").on("load", function() { 
     var myVar = this.window.test; 
     $("#link").on("click", function() { 
      alert(myVar); 
     }); 
    }); 
</script> 

Answer 3

prova per usare questo

<iframe src="iframe.html" id="iframe" onload="loader()" width="200" height="100"> </iframe> 

<script> 
    var myVar 
    function loader(){ 
     myVar = window.frames[0].window.test; 
    } 
</script> 
<a href="#" onclick='alert(myVar)' id="link">Click</a> 

Answer 4

Nella soluzione di parte I j volevamo sottolineare che quando si utilizza la funzione gestore di eventi onload jquery e si desidera accedere all'oggetto "this" jquery, è necessario utilizzare la notazione $ (this.attr).