用window.name来解决不同网页间的数据通信

来源：互联网发布：软件出售编辑：程序博客网时间：2024/06/01 08:50

今天有个同事问到如何在原网页和被打开的网页中进行数据通信，这里说一下用window.name的解决方法。
a.html

<!doctype html><!DOCTYPE html><html><head>    <title></title></head><body>    <script type="text/javascript" src="jquery-1.10.2.js"></script><a href="javascript:void 0;" id="click">click</a><script type="text/javascript">    window.name = 'haha';    document.getElementById('click').onclick = function(event) {        open = window.open('b.html');        open.name = 'aaaaaaaaaaa';        event.stopPropagation()        return false;    };    window.onclick = function(){        console.log(window.name);        open.name ='1111111111111111'        $(open).trigger('click')    }</script></body></html>

b.html

<!doctype html><!DOCTYPE html><html><head>    <title></title>    <script type="text/javascript" src="jquery-1.10.2.js"></script></head><body>hello<script type="text/javascript">    console.log(window.name);    console.log(window.opener.name);    window.opener.name = '222222222222';    window.onclick = function() {        console.log(window.name)    }    $(window.opener).trigger('click');</script></body></html>

1.首先可以在网页a里对网页b的tmp.name进行数据赋值，然后在b里通过window.name进行访问。或者在网页a里对自身的window.name进行赋值，然后在b里用window.opener.name进行访问。这种可用于在某个网页中打开新网页，然后进行数据单向的通信。
2.如果需要在两个网页间进行通信，那么可以在网页a,b里绑定一种事件，这里绑定的是点击事件，然后在各自的网页里进行触发。事件冒泡什么的这些细节可能需要注意一下。

0 0