從iframe內部調用父Javascript函數

Question

我有一個iframe（在我的域中），iframe有一個文件iframe.js 。

我的父文檔有一個文件parent.js 。

我需要調用一個函數，在parent.js ，從一個函數，在iframe.js 。

我試過做window.parent.myfunction()這個函數在parent.js文件中。

但是，它沒有用。 只有當我把這個函數放在父頁面上時（我的意思是在HTML中），它才有效。

知道如何讓這個工作嗎？

Answer 1

試試parent.myfunction() 。 還要100％確定parent.js包含在父文檔中。

Answer 2

我知道這是一個老問題，但如果接受的答案不起作用（它對我不起作用）你可以在parent.js中做到這一點

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

現在從iframe你可以像你最初想要的那樣調用myfunction（）

window.parent.myfunction(); 

Answer 3

Window.postMessage()方法安全地啟用cross-origin通信。

如果您可以訪問父頁面，則可以傳遞任何數據，也可以直接從Iframe調用任何父方法。

父頁面：

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);
}

iframe代碼：

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

參考文獻：

• 跨文檔消息傳遞（ https://html.spec.whatwg.org/multipage/comms.html#web-messaging ）
• Window.postMessage方法（ https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage ）
• 我可以使用（ http://caniuse.com/#search=postMessage ）