window.postMessage 是一种跨文档通信的方法,允许来自一个文档(例如一个网页或Iframe)向另一个文档发送消息。这在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
})
发表评论