ifram子页面父页面相互调用

寻知图教师端---知识点统计功能用到了遮罩弹出框，页面用到了ifram 。因此出现了子页面调用父页面遮罩的问题。

实现过程如下：

1、在父页面添加遮罩和窗体标签

<div class="theme-popover-mask"></div>

    <!-- 表格弹出框 -->
    <div class="theme-popover">
        <div class="theme-poptit">
            <a href="javascript:;" title="关闭" class="close" id="a_closeWin"><img
                src="img/close_03.jpg"></a>
            <h3 id="pop_h3_tit">一元二次方程—入门学生名单（31人）</h3>
        </div>
        <div class="theme-popbod">
            <div id="pop_div_stu">
                <span>张三</span><span>张王三</span><span>张刘三</span><span>张赵三</span><span>张我三</span>
            </div>
            <button id="btn_close" class="btn-close">关闭</button>
        </div>
    </div>

2、在子窗体中设置标签显隐

        //显示遮罩函数
    function showMaskStuName() {
        $('.theme-popover-mask', parent.document).fadeIn(100);
    }
    //隐藏遮罩函数
    function hideMaskStuName() {
        $('.theme-popover-mask', parent.document).fadeOut(100);
    }

此时，引出一个问题，子页面和父页面相互调用标签和方法：

I 子页面调用父页面标签：

当前使用的子页面调用父页面标签的方式是：

A、$('.theme-popover-mask', parent.document)

经网页查询，还有其他方法

B、window.parent.document.getElementByIdx_x("元素id");

前端同事给出的方法：

C、window.parent.$('.theme-popover')

       //弹框关闭
    window.parent.$('.theme-poptit .close').click(function(){
        window.parent.$('.theme-popover').slideUp(200);
        window.parent.hideMask();
    })
    window.parent.$(".btn-close").on("click",function(){
        window.parent.$(".theme-poptit .close").trigger("click");
    });

II 子页面调用父页面方法：

A、window.parent.func();

III 父页面调用子页面标签：

A、$("#objid",document.frames('iframename').document)

B、window.frames["iframe_ID"].document.getElementByIdx_x("元素id");

参考文章：jquery、js调用iframe父窗口与子窗口元素的方法整理

有待补充的；ifram子页面和父页面交互的文章