在开发中我们会遇到俩个窗口传值，我一般会使用俩种传值方式，一、使用地址栏传值，然后另一个窗口取地址栏内容解析。二、使用sessionStorage进行传值。但最近看面试题发现还可以使用postMessage传值，但是遇到一个坑，具体原因本人也是没有找出，只是做了简单分析，希望看到这篇文章的大佬帮忙解决。
第一个页面的代码如下
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<title>Title
<button id="btn">dianji
window.sessionStorage
document.getElementById('btn').onclick =function () {
var popup = window.open('test2.html');
/// When the popup has fully loaded, if not blocked by a popup blocker:
setTimeout(function() {
// 当前窗口向目标源传数据
popup.postMessage('asdasd', '*');
}, 0);
}
</html>
第二个页面的代码如下：
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<title>Title
window.addEventListener('message', function(e) {
alert(e.data)
// console.log(e.source === window.opener); // true
});
</html>
现在我与到的问题是，如果第一个页面去掉setTimeout 第二个页面就会触发不了message事件。据我猜测可能是如果去掉第一个页面的setTimeout 可能页面会直接发送消息，但此时第二个页面还在加载中，但消息已经发送过，所以触发不了。还希望看见此篇文章的大佬解决
网友评论