layer实现关闭弹出层刷新父界面功能详解
Posted xiaogou
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了layer实现关闭弹出层刷新父界面功能详解相关的知识,希望对你有一定的参考价值。
方案一:
在layer弹出层中调用父界面重新加载函数
1
2
3
|
window.parent.location.reload();
varindex = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
|
方案二:
调用layer插件的end回调方法:
end - 层销毁后触发的回调
类型:Function,默认:null
无论是确认还是取消,只要层被销毁了,end都会执行,不携带任何参数。
父窗口打开layer弹出框时,添加end回调
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
functionopenLayer() {
//iframe层
parent.layer.open({
type: 2,
title:‘修改‘,
shadeClose:false,//点击遮罩关闭
shade: 0.8,
area: [‘30%‘,‘45%‘],
maxmin:true,
closeBtn: 1,
content: [url,‘yes‘],//iframe的url,yes是否有滚动条
end:function() {
location.reload();
}
});
|
layer弹出框处理完成之后,就不需要调用其他刷新操作函数了,直接关闭就行了
1
2
|
varindex = parent.layer.getFrameIndex(window.name);
parent.layer.close(index);
|
相比较而言,第一种方案会更佳,因为在操作逻辑上,手动关闭弹出框,应该不触发刷新操作,只有当弹出框的处理逻辑执行成功后,调用函数关闭弹出框才触发父界面刷新操作,基于这个逻辑,应该选择方案一。方案二,不管怎样都会刷新页面,实际上无端的增加了服务器的处理压力。
方案二:可以解决子页面处理后的结果发送给子页面的父页面的问题。
对于layer.js出现回调关闭父类的弹出层时,之前的表单的submit失效的问题:
如何解决:网上有很多,有的是转为ajax的请求,在数据传输完再关闭父类的弹出层:
下面是关闭父弹出层的办法:
1
2
|
varindex = parent.layer.getFrameIndex(window.name);//获取窗口索引
parent.layer.close(index);// 关闭layer
|
采用ajax这样可以,但是我做的是支付,要弹出页面才能支付,不能转换为ajax,怎么帮?后面我老大说:“你就不能晚点执行关闭吗”?这是一个想法试了一下就好了。
附上代码:
1
2
3
4
5
|
$("#myForm").submit();
varindex = parent.layer.getFrameIndex(window.name);//获取窗口索引
setTimeout(function() {
parent.layer.close(index);// 关闭layer
},500);
|
我还需要在关闭父类窗口后再打开一个窗口,则怎么解决,后面发现layer.js留有一个好的方式,那就是调用父窗口的方法,这个不受子窗口的影响,通过:parent.父类方法名(参数)这样就可以了,在父窗口中再调用layer.js的弹出就好了。
以上是关于layer实现关闭弹出层刷新父界面功能详解的主要内容,如果未能解决你的问题,请参考以下文章