问题描述:
本地http://localhost/data.html
向异域http://www.lamport.me/data2.html获取数据
如果该文件不能访问,你可以在自己的wamp中配置一个虚拟主机进行访问
虚拟主机的配置地址:
http://blog.csdn.net/super_yang_android/article/details/53991982
http://localhost/data.html代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>window.postMessage</title>
<script>
/*
* window.postMessage是html5中的方法
* */
window.onload = function () {
var oInput = document.getElementById('input1');
var oButton = document.getElementById('btn1');
oButton.onclick = function () {
var data = oInput.value;
window.frames[0].postMessage(data, '*');
}
}
</script>
</head>
<body>
<iframe src="http://www.lamport.me/data2.html" style="display:none" frameborder="0"></iframe>
<input type="text" id="input1" value="你好,地球,我来自黑暗星球">
<button id="btn1">点击我通过iframe框架向http://www.lamport.me/data2.html页面发送并返回数据</button>
</body>
</html>
异域http://www.lamport.me/data2.html代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>window.postMessage</title>
<script>
window.onmessage = function(e) {
e = e || event;
alert('我接受到来自外太空的数据:' + e.data);
}
</script>
</head>
<body>
</body>
</html>