如何在父页面上打开ChildPage的模式弹出窗口？

Question

如何在父页面上打开ChildPage的模式弹出窗口？如图所示，父页面有两个子页面，绿色和蓝色。模式弹出窗口出现在绿色页面上。如何在父页面（在中心）中打开ChildPage的模式弹出窗口？

Answer 1

查看window.postMessage https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

在孩子中，执行以下操作，作为按钮上的onClick处理程序：

function openParentModal() {
   parent.postMessage("openModal", "http://targetorigin.com") // Change origin
}

在父母中：

function receiveMessage(event) {
   if (event.origin !== "http://targetorigin.com") // Change origin
      return;

   if(event.data == "openModal") { 
      openModal()
   }
}
window.addEventListener("message", receiveMessage, false);