HTML5 postMessage 跨域跨窗口传递消息

父页面代码：
<!DOCTYPE html>
<html>
<head>
    <title>选择位置demo</title>

    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <script type="text/javascript" src="dist/jquery-1.7.1.js"></script>
    <script type="text/javascript" src="libs/layer/layer.js"></script>
</head>
<body>
    <iframe id="ifr" src="http://10.100.10.167:8061" style="width: 1200px; height: 800px;"></iframe>

    <script type="text/javascript">
        $("#ifr").load(function () {
            var data = {
                method: "selectLocation",
                url: window.location.href,
                lng: 113.13,
                lat: 23.01
            };

            //给地图页面发消息
            window.ifr.contentWindow.postMessage(JSON.stringify(data), ifr.src);
        });

        //监听消息
        window.addEventListener("message", function (e) {
            var d = eval("(" + e.data + ")");

            if (d.method == "selectLocationComplateCallback") {
                layer.alert(d.lng.toFixed(7) + "," + d.lat.toFixed(7), { title: "信息" });
            }
        });
    </script>
</body>
</html>
View Code