bootstrap - Llamar a la función padre de Javascript desde dentro de un iframe

iframe width

Question

Tengo un iframe (en mi dominio), ese iframe tiene un archivo iframe.js .

Mi documento principal tiene un archivo parent.js .

Necesito llamar a una función que está en parent.js , desde una función que está en iframe.js .

Intenté hacer window.parent.myfunction() esta función está en el archivo parent.js .

Pero, no funcionó. Solo cuando puse la función en la página principal (quiero decir en el HTML), funcionó.

¿Alguna idea de cómo hacer que esto funcione?

Answer 1

Prueba solo parent.myfunction() . También esté 100% seguro de que parent.js está incluido en su documento principal.

Answer 2

Sé que esta es una vieja pregunta, pero en caso de que la respuesta aceptada no funcione (no funcionó para mí) podrías hacer esto dentro de parent.js

window.myfunction = function () {
   alert("I was called from a child iframe");
}

Ahora desde el iframe puedes llamar a myfunction () como inicialmente quisiste

window.parent.myfunction(); 

Answer 3

Window.postMessage() método Window.postMessage() permite de forma segura la comunicación de cross-origin .

Si tiene acceso a la página principal, se pueden pasar los datos y se puede Iframe directamente a cualquier método padre desde Iframe .

Página principal:

if (window.addEventListener) {
    window.addEventListener("message", onMessage, false);        
} else if (window.attachEvent) {
    window.attachEvent("onmessage", onMessage, false);
}

function onMessage(event) {
    // Check sender origin to be trusted
    if (event.origin !== "http://example.com") return;

    var data = event.data;      
    if (typeof(window[data.func]) == "function") {
        window[data.func].call(null, data.message);
    }
}

// Function to be called from iframe
function parentFuncName(message) {
    alert(message);
}

Código iframe:

window.parent.postMessage({
    ''func'': ''parentFuncName'',
    ''message'': ''Message text from iframe.''
}, "*");

Referencias

• Mensajería entre documentos ( https://html.spec.whatwg.org/multipage/comms.html#web-messaging )
• Método Window.postMessage ( https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage )
• ¿Puedo usar ( http://caniuse.com/#search=postMessage )