javascript中的方法回调和父页面Iframe的方法调用

来源:互联网 发布:冰毒淘宝地址 编辑:程序博客网 时间:2024/04/30 03:33

目的:调用父层iframe的js方法弹出信息框,信息框的表单信息填充完后,点击button回调子层页面刷新函数

1.参考案例 : video.js和scooper.video.js

  • scooper.video.js
window.scooper.video = {    ....    /**     * 获取轮询配置界面列表视频     * @param callbackFunc     */    isOpenedList:       function(callbackFunc) {        if(this.isOpened.isEmpty())            return;        var jsonData =  {};        var size = this.isOpened.size();        var list = new Array();        for(var i = 0; i < size; i++) {            var key = this.isOpened.arr[i].key;            list.push(key);        }        jsonData.memIds = list;        $.getJSON(contextPath + "/video/findOrgMemberByIds", jsonData, function(data){            if(data.code==0 && callbackFunc != undefined){                callbackFunc(data.data);            }           });    },    ....};
  • video.js
    /*     * 已打开视频列表     */    function loadIsOpenedListEvent(){        scooper.video.isOpenedList(function(resp){            $("#video-opened-list-itemContainer").html('');            var SHtml = '';            $.each(resp, function(i, obj) {                SHtml += loadList(obj, 1);            });            $("#video-opened-list-itemContainer").append(SHtml);            initTableEvent();//初始化表格事件,将每行TR添加点击触发修改事件            initBtnCliclEvent();//初始化打开关闭按钮点击事件        });    }

2.核心思想

  • 父层 main.js
    /**     * 所有工作流、维修过程等Layer弹框 部分被覆盖问题     * 定义父层的layer弹框 可复用的全局方法     * @url layer 需要打开的页面路径     * @option layer 可配置参数     *  > path  : '${contextPath}/js/lib/layer'     *  > type     *  > title     *  > shadeClose     *  > scrollbar     *  > areaW     *  > areaH     *  > shade     *  > content     *  > success     *  > end     */    window.openLayerWin = function(option,success,end){        /**         * 模块化引用layer         * 主页面需在当前js前引入layer.js         */        layer.config({            path : option.path        });         layer.open({            type        : option.type       == undefined ?  2                           :   option.type,            title       : option.title      == undefined ?  ''                          :   option.title,            fix         : option.fix        == undefined ?  false                       :   option.fix,            shadeClose  : option.shadeClose == undefined ?  true                        :   option.shadeClose,            scrollbar   : option.scrollbar  == undefined ?  false                       :   option.scrollbar,            maxmin      : option.maxmin     == undefined ?  false                       :   option.maxmin,            area        : [ option.areaW    , option.areaH ],            shade       : option.shade      == undefined ? 0.5                          :   option.shade,            content     : option.content    == undefined ?  ''                          :   option.content,            success     : success           == undefined ? (function(layero,index){})   :  (function(layero,index){success();})  ,            end         : end               == undefined ? (function(){})               :   (function(){end();}),                           });    }

子层 group-manager.js

var option = {        path        :   '${contextPath}/js/lib/layer',        type        :   2,        title       :   '',        fix         :   false,        shadeClose  :   true,        scrollbar   :   false,        maxmin      :   false,        shade       :   0.5,        areaW       :   '520px',        areaH       :   '400px',        content     :   capsule.request.path.groupMan.layer.groupManAddLayerShow                    };window.top.openLayerWin(option,undefined,function(){                loadGroupCenterInfo();});

loadGroupCenterInfo是子层的内置方法

3. 子父iframe的方法调用

 通过js的window对象进行方法的传递
1 0