H5 跨域通信：
在主页面中通过iframe嵌入外部页面，通过iframe的window对象postMessage方法向iframe页面传递消息。
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>跨域通信示例</title> 6 <script type="text/javascript"> 7 function hello(){ 8 var iframe = document.getElementById("iframe").contentWindow; 9 iframe.postMessage("hello, 这是主页面传过来的数据", "http://localhost/html5/b.html"); 10 } 11 </script> 12 </head> 13 <body> 14 <h1>跨域通信示例</h1> 15 <iframe width="400" src="http://localhost/html5/b.html" onload="hello()" id="iframe"> 16 </iframe> 17 </body> 18 </html>
iframe页面中通过对窗口对象的message事件进行监听，以获取消息。
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <script type="text/javascript"> 6 window.addEventListener("message", getEvent, false); 7 function getEvent(event){ 8 alert("从" + event.origin + "那里传递过来的信息是:\n" + event.data); 9 } 10 </script> 11 </head> 12 <body> 13 iframe 页面 14 </body> 15 </html>
---------------------------------------------------------------------------------
笔者水平有限，若有错漏，欢迎指正，如果转载以及CV操作，请务必注明出处，谢谢！
笔者水平有限，若有错漏，欢迎指正，如果转载以及CV操作，请务必注明出处，谢谢！
分类:
Html | Css
本文转自Windstep博客园博客，原文链接：http://www.cnblogs.com/lwbqqyumidi/archive/2012/11/04/2754000.html,如需转载请自行联系原作者
