zoukankan      html  css  js  c++  java
  • IFrame消息传递

    第一种IFrame通信:

     

    //这个消息从A的作用域发出

    this.contentWindow.postMessage({}, "*");

    //B作用域开启监听获取A发过来的消息

    window.addEventListener('message', function (event) {
    });

    //B向A发出消息

    window.parent.postMessage({ }, '*');

    //反过来A接收B发过来的消息

    window.addEventListener('message', function (event) {
    });

    第二种IFrame通信:

    //D向E通信

    document.getElementById('E IFrame 的ID').contentWindow.postMessage({}, '*'); 

    //接收消息都是同一种方式

    window.addEventListener('message', function (event) {
    });

    ---实际运用

           //发出消息
                this.contentWindow.postMessage({
                    type: 'message-1',
                    body: {
                        args: '消息内容 可以是任何对象'
                    }
                }, '*');
                //发出消息
                document.getElementById('outpAdmissionOrderFrame').contentWindow.postMessage({
                    type: 'message-2',
                    body: {
                        args: '消息内容 可以是任何对象'
                    }
                }, '*');
                //接收消息
                window.addEventListener('message', function event(event) {
                    if (event.data.type === "message-2") {
                        //event.data.body获取消息内容
                        //处理
                    } else if(event.data.type === "message-1"){
                        //event.data.body获取消息内容
                        //处理
                    }
                });
  • 相关阅读:
    什么是软件测试架构师?
    Spring常用注解
    Ant 风格路径表达式
    <url-pattern>写成/和/*的区别
    Spring+SpringMVC+Hibernate
    Spring+SpringMVC+MyBatis框架整合
    Spring各个jar包的介绍
    单点登录原理与简单实现(转载)
    博客网站系统
    POM.xml配置文件详解
  • 原文地址:https://www.cnblogs.com/ms-grf/p/11545290.html
Copyright © 2011-2022 走看看