layer通过父页面调用子页面的方法及属性

引言

在使用layer.js的过程中，需要通过layer.open()以iframe的形式打开特定的页面，同时需要用layer的按钮对打开的页面进行提交及重置操作，但是苦于不知如何在父页面调用子页面的方法及属性，查阅大量资料之后终于得出解决方案。

第一种方法：

首先

这是layer.open()的代码

 layer.open({
      id: 'insert-form',
      type: 2,
      title: '录入数据',
      shadeClose: true,
      shade: 0.8,
      area: ['1100px', '90%'],
      content: 'insert.html',
      btn: ['提交', '重置'],
      yes: function (index) {
        insertSubmit()
      },
      btn2: function (index) {
        insertReset();
        return false;
      }
    });

需要注意的是，必须提供一个id属性，以供之后查找到所需的iframe。

其次：重点

这是调用子页面方法的代码：

function insertSubmit(){
    var frameId=document.getElementById('insert-form').getElementsByTagName("iframe")[0].id;
    $('#'+frameId)[0].contentWindow.mySubmit();
  }


  function insertReset(){
    var frameId=document.getElementById('insert-form').getElementsByTagName("iframe")[0].id;
    $('#'+frameId)[0].contentWindow.myReset();
  }

注意：这段代码是写在父页面中的，即layer所在的页面。

再次

这是子页面（layer中打开的页面）中被调用的方法：

    function mySubmit(){
        $('#form').submit();
    }


    function myReset(){
        $('#form')[0].reset();
    }

第二种方法：

layer.open({
                         content:'${pageContext.request.contextPath}/canshu/dh/daihoulaiyuanzhuangtai/toupdate?id='+row.id,
        success:function(layero, index){},
        title : false,
        type : 2,
        closeBtn:0,
        area : [ "400px", "35%" ],
        btn:['确认','取消'],
        yes:function(index,layero){
            var iframeWin = window[layero.find('iframe')[0]['name']]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();

            //调用授权提交方法
            var flag = iframeWin.mySubmit();
            return flag;
        },
    })

如此

便实现了引言中所需要被实现的功能。