layer.js.php,layer.js之父子页面实例详解

本文主要和大家分享layer.js之父子页面实例，关于父子页面的知识我们可能有所了解，希望本文能帮助大家更加掌握layer.js之父子页面。

layer是一款近年来备受青睐的web弹层组件，官网地址是：http://layer.layui.com/

可以从官网上下载最新版本。

当layer以iframe层的方式弹出新的窗口(子页面)，如何在子页面中访问父页面的元素和函数。

1、访问父页面元素值var parentId=parent.$("#id").val();//访问父页面元素值

2、访问父页面方法var parentMethodValue=parent.getMethodValue();//访问父页面方法

3、如何关闭弹出的子页面窗口var index = parent.layer.getFrameIndex(window.name); //获取窗口索引

parent.layer.close(index);//关闭弹出的子页面窗口

4、如何从子页面执行刷新父页面操作parent.location.reload(); // 父页面刷新

layer.js弹出多个iframe如何找到父页面方法

父亲页面–function aa() {

var index = parent.layer.getFrameIndex(window.name);

var iframeName = 'layui-layer-iframe' + index;

openDialog1('选择XXX', '${ctx}/*****,'800px ', '500px ',iframeName);

} 'function openDialog1(title, url, width, height, target) {

top.layer.open({

type: 2,

area: [width, height],

title: title,

maxmin: true,

//开启最大化最小化按钮

content: url,

btn: ['确定', '关闭'],

yes: function(index, layero) {

var body = top.layer.getChildFrame('body', index);

var iframeWin = layero.find('iframe')[0]; //得到iframe页的窗口对象，执行iframe页的方法：iframeWin.method();

var inputForm = body.find('#inputForm');

var top_iframe;

if (target) {

top_iframe = target; //如果指定了iframe，则在改frame中跳转

} else {

top_iframe = top.getActiveTab().attr("name"); //获取当前active的tab的iframe

}

inputForm.attr("target", top_iframe); //表单提交成功后，从服务器返回的url在当前tab中展示

if (iframeWin.contentWindow.doSubmit(top_iframe)) {

top.layer.close(index); //关闭对话框。

top.window[iframeName].frames.location.reload(); //刷新父亲

}

},

cancel: function(index) {}

});

}//子页面回调方法

function addRecord(name,chainName)

{

alert(name);

}

子页面function doSubmit(iframeName) {

var sel = $("tbody tr td input.i-checks:checked"); var size = sel.size(); if (size == 0) {

top.layer.alert('请至少选择一条数据!', {

icon: 0,

title: '警告'

}); return false;

} else { for (var i = 0; i < size; i++) {

top.window[iframeName].addRecord(sel[i].name, sel[i].value);

} return true;

}

}

以上就是本篇文章的内容，大家对layer不熟悉的同学可以看看哦！

相关推荐：