zoukankan      html  css  js  c++  java
  • html5跨文档消息传递

    基于js的同源策略使文档不能跨域访问,为此html5提供了跨文档消息传递功能,下贴出示例...

    http://localhost:4933站页面代码

    <!DOCTYPE html>

    <head>   

    <title></title>
    <script type="text/javascript">
            window.addEventListener("message", function(ev) {     

            ev.origin == "http://www.woyun.com" && alert(ev.origin + "说:" + ev.data);       

        }, false);


            function say() {    

         document.getElementById("myifr").contentWindow.postMessage("Hello", "http://www.woyun.com");   

            }   

    </script>
    </head>

    <body>   

    <iframe src="http://www.woyun.com/mytest.htm" onload="say()" id="myifr"></iframe>

    </body>

    </html>

    http://www.woyun.com/站页面代码

    <!DOCTYPE html>

    <head>   

    <title></title>
    <script>       

      window.addEventListener("message", function(ev) {     

            if (ev.origin == "http://localhost:4933") {           

            document.body.innerHTML = ev.origin + "说:" + ev.data;     

                 ev.source.postMessage(ev.data.split("").reverse().join(""), ev.origin);     

            }       

      }, false);
    </script>
    </head>

    <body>

    </body>

    </html>

    运行效果截图...

    使用跨文档消息传递首先监控窗口message事件

    事件对象包括的属性

    data:传递的内容,可以是字符串或对象

    origin:发送消息的窗口的协议、域名和端口号

    source:发送消息的窗口对象

    使用窗口对象的postMessage发送消息,postMessage接受俩个参数,传递的内容和接受页面的origin...

  • 相关阅读:
    C#泛型
    QT QML Keys 处理注意事项
    Ubuntu 16.04 安装 QT Create 5.3.1
    在VMWare中安装了Ubuntu16.04,想要 Win10 中通过 SecureCRT 来操作
    Ubuntu16在VMWare中使用共享文件夹
    QT QLineEdit 获取焦点/获取焦点后全选字符
    QT Layout 布局的重要性
    QT ToolBar 工具栏浮动状态
    QT 格式化字符串功能
    QT 窗体之间(MainWindow 和 Dialog)数据传递
  • 原文地址:https://www.cnblogs.com/ygm125/p/2082534.html
Copyright © 2011-2022 走看看