window.postMessage 是一種跨文檔通信的方法,允許來自一個文檔(例如一個網頁或Iframe)向另一個文檔發(fā)送消息。這在Iframe中使用尤其有用,因為它允許父頁面和Iframe之間的安全通信。實例中在父頁面點擊按鈕彈出子頁面窗口,子頁面窗口關閉后需要傳遞參數到父頁面。
父頁面
window.addEventListener('message', function(event) {
if (event.data.action === 'dataFromChild') {
var id = event.data.id;
var sn = event.data.sn;
var name = event.data.name;
var price = event.data.price;
var thumb = event.data.thumb;
// 處理數據
console.log(id);
}
}, false);
子頁面
$(".sel").click(function(){
var id = $(this).data("id");
var sn = $(this).data("sn");
var name = $(this).data("name");
var price = $(this).data("price");
var thumb = $(this).data("thumb");
window.parent.postMessage({ action: 'dataFromChild', id: id, sn: sn, name: name, price:price, thumb:thumb }, '*');
var index = parent.layer.getFrameIndex(window.name); //獲取窗口索引
parent.layer.close(index); // 關閉layer
})
發(fā)表評論