我有这样的脚本
function resizeCrossDomainIframe(id,other_domain) {
var iframe = document.getElementById(id);
window.addEventListener('message',function (event) {
if (event.origin !== other_domain) return; // only accept messages from the specified domain
if (event.data === "reload") top.location.reload(); // If child page sends reload request - reload it without any questions asked
if (isNaN(event.data)) { //If this isn't integer than it is alert
alert(event.data); // Show alert if not integer
} else {
var height = parseInt(event.data) + 5; // add some extra height to avoid scrollbar
iframe.height = height + "px";
alert(event.data);
}
},false);
}
它的作用是动态调整iframe大小.现在在第一个iframe页面上,我只需要一个提醒,但在iframe页面中,我有链接,当我进入第二页时,我看到2个警报,当我去第三页 – 我得到3个警报,第4个链接触发4个警报等…
<body class="settingspage" onload="parent.postMessage(document.body.scrollHeight,'<?PHP echo $_SESSION['SESS_ACCESSING_FROM']; ?>');">
我尝试清除“事件”数组,但我仍然收到警报,但这次它们是空的,但是警报数量等于iframe中的链接点击次数？
为什么是这样 ？
解决方法
问题是,每次单击iframe中的链接时,会触发加载事件.
所以你每次点击链接时绑定你的消息事件.
第一次一切都是正确的,因为你绑定一次,第二次你收到两个警报,因为你绑定了两次,等等…
所以解决方案是删除卸载iframe的’message’事件.
因此,您必须清理代码：
var listener = function (event) {
if (event.data === "reload") top.location.reload(); // If child page sends reload request - reload it without any questions asked
if (isNaN(event.data)) { //If this isn't integer than it is alert
alert(event.data); // Show alert if not integer
} else {
var height = parseInt(event.data) + 5; // add some extra height to avoid scrollbar
iframe.height = height + "px";
alert(event.data);
}
};
function iframeOnLoad(id) {
var iframe = document.getElementById(id);
window.addEventListener('message',listener,false);
}
function iframeOnUnload(id) {
var iframe = document.getElementById(id);
window.removeEventListener('message',false);
}
