Javascript 当我需要在一个父PHP文件中捕获两个消息时，如何使用postMassage进行跨域访问

两天前我遇到了一个问题，我需要从另一个域中获取iframe的高度，并在父域中捕获它，以便在没有滚动条的情况下显示iframe

我是这样解决的

子域上的PostMessage函数，将div的高度发送到父域

window.onload = function () {
   var offsetHeight = document.getElementById('LoanToggler').offsetHeight;
   parent.postMessage(offsetHeight ,"*");
};

父域的函数捕获来自子域的消息

var myEventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
var myEventListener = window[myEventMethod];
var myEventMessage = myEventMethod == "attachEvent" ? "onmessage" : "message";
myEventListener(myEventMessage, function (e) {
    if (e.data === parseInt(e.data))
    document.getElementById('sizetracker').style.height = e.data + "px";
}, false);

它动态地工作得非常好。子项的高度总是不同的，所以函数每次都会捕捉到它并显示在父域中

现在谈谈我的问题。 例如，我在父域中有

parent.php

文件，其中我已经从子域中有一个iframe

index.php

。我也需要来自同一子域但

form.php

的第二个iframe

我试过这个： 在f

orm.php

中编写相同的

postMessage函数

，但父域只捕获来自子域的一个消息。我在父域复制了cate函数，并链接了变量和函数名，但这并没有帮助。

---

有什么想法吗

嘿，我终于找到了解决办法

第一个子php文件

window.onload = function () {
   var offsetHeight = document.getElementById('LoanToggler').offsetHeight;
   parent.postMessage({v1: offsetHeight} ,"*");
};

window.onload = function () {
   var offsetHeight = document.getElementById('childdiv2').offsetHeight;
   parent.postMessage({v2: offsetHeight} ,"*");
};

第二个子php文件

window.onload = function () {
   var offsetHeight = document.getElementById('LoanToggler').offsetHeight;
   parent.postMessage({v1: offsetHeight} ,"*");
};

window.onload = function () {
   var offsetHeight = document.getElementById('childdiv2').offsetHeight;
   parent.postMessage({v2: offsetHeight} ,"*");
};

父文件，其中两个iframe都是。捕手的功能与上述相同，但只改变了两行：

if (e.data.v1 === parseInt(e.data.v1)){
    document.getElementById('sizetracker').style.height = e.data.v1 + "px";
}
 if (e.data.v2 === parseInt(e.data.v2)){
    document.getElementById('parentdiv2').style.height = e.data.v2 + "px";
}