回調JavaScript中的彈出窗口

我希望我能夠做好我的功課，在過去的幾個小時內搜索互聯網並在發佈之前嘗試所有內容，但我真的接近稱它不可能，所以這是我的最後一次採取。回調JavaScript中的彈出窗口

我想要一個簡單的事情（但在JavaScript好像硬）：

點擊按鈕 - >打開窗口（使用window.open）
執行在彈出窗口中的動作和返回值父母（開叫者）

但我想以系統的方式實現它，有一個回調定義爲這個彈出;是這樣的：

var wnd = window.open(...) 
wnd.callback = function(value) { 
    console.log(value); 
};

我試過在彈出的窗口JS代碼定義回調屬性：

var callback = null;

不幸的是，這並不工作，因爲...

$('#action').click(function() { 
    console.log(callback); 
});

。 ..返回剛剛設置的「null」。我已經嘗試在窗口加載（通過window.onload = ...和$（窗口）.ready（）），沒有工作後在父窗口中設置回調。

我也試着定義一些方法，在子窗口源代碼內註冊回調：

function registerCallback(_callback) 
{ 
    callback = _callback; // also window.callback = _callback; 
}

但與相同的結果。

而我沒有更多的想法。當然，使用window.opener來設置這個值很簡單，但是我會失去這個子窗口所需的大部分靈活性（實際上是DAM系統的資產選擇器）。

如果您有一些想法，請分享它們。謝謝！

來源

2012-05-25 Miro Hudak

經過幾個小時的實驗後，我認爲，我發現了一個解決我的問題的可行解決方案。

問題是從父窗口引用jQuery並在此窗口上觸發jQuery事件（我是Mac用戶，但我想，jQuery具有跨平臺工作，所以IE兼容性不是問題）。

這是我對錨點擊處理代碼...

$(this).find('a[x-special="select-asset"]').click(function() { 
    var evt = jQuery.Event('assetSelect', { 
     url:  'this is url', 
     closePopup: true, 
    }); 
    var _parent = window.opener; 
    _parent.jQuery(_parent.document).trigger(evt); 
});

...這是事件處理程序的代碼：

$(document).bind('assetSelect', function (evt) { 
    console.log(evt); 
});

該解決方案是好的，如果你不不需要區分資產選擇窗口的多個實例（只有一個窗口會分派「assetSelect」事件）。我還沒有找到一種方法將一種標籤參數傳遞給窗口，然後在事件中傳回。由於這個原因，我選擇了Fancybox（最終，更好，視覺上更舒適）解決方案。不幸的是，默認情況下，沒有辦法區分實例。因此，我已經擴展了Fancybox，正如我在博客文章中所描述的那樣。我在這裏不包括博客文章的全文，因爲這不是這個問題的主題。

URL的博客文章：http://82517.tumblr.com/post/23798369533/using-fancybox-with-iframe-as-modal-dialog-on-a-web

來源

2012-05-26 15:10:09

你知道這是否也適用於https url嗎？ – Amien

想到HTML5的postMessage。它旨在完成您想要完成的任務：從一個窗口發佈消息並在另一個窗口中處理消息。

https://developer.mozilla.org/en/DOM/window.postMessage

需要注意的是，這是一個相對較新的標準，所以老的瀏覽器可能不支持此功能。

http://caniuse.com/#feat=x-doc-messaging

這是非常簡單的使用方法：

window.postMessage("message", "*"); 
//'*' is the target origin, and should be specified for security

要監聽的目標窗口的消息：

從源窗口發送消息

window.addEventListener 
("message", function(e) { 
console.log(e.data); //e.data is the string message that was sent. 
}, true);

來源

2012-05-25 23:40:55

謝謝您的回答，但我很害怕，我不能局部IE支持走在這條和caniuse.com狀態，即支持僅限於框架/ iframe（甚至在IE10.0中）。 –

回調JavaScript中的彈出窗口

回答

相關問題