本文主要介紹了layui框架中layer父子頁面交互的方法,結合實例形式分析了layer父子頁面交互的常用技巧以及layer彈出多個iframe找到父頁面的操作方法,需要的朋友可以參考下，希望能幫助大家。
本文實例講述了layui框架中layer父子頁面互動的方法。分享給大家供大家參考，具體如下：
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彈出多個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;
}
}相關推薦：
原生js取得iframe中dom元素--父子頁面互相取得對方dom元素的方法
javascript父子頁面通訊實例詳解_javascript技巧
#以上是layui框架中layer父子頁面互動詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章！
