位置: 编程技术 - 正文
推荐整理分享layer实现关闭弹出层刷新父界面功能详解(layer关闭当前窗口),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:layer去掉关闭按钮,关闭layer弹出层,layer关闭当前窗口,关闭layer.open,layer弹窗关闭时触发事件,layer关闭所有弹出层,layer弹窗关闭时触发事件,layer 关闭,内容如对您有帮助,希望把文章链接给更多的朋友!
本文实例讲述了layer实现关闭弹出层刷新父界面功能。分享给大家供大家参考,具体如下:
layer是一款近年来备受青睐的web弹层组件,她具备全方位的解决方案,致力于服务各水平段的开发人员,您的页面会轻松地拥有丰富友好的操作体验。
最近一个项目采用的是hui前端框架,他的弹出层就是用的layer插件,对于弹出层,有一个操作体验大家都知道,就是关闭弹出层,需要刷新父页面。开始写的时候,我陷入了自己的误区,在弹出层处理成功之后,我调用的是:
这个地方是这样写也没错,但是如果这么写,它就只能被一个地方调用了,如果有多个地方调用的话,它不能返回原地址,而是重定向到新的url地址上去了。而刚好,在我的项目中间,某一个弹出层被两个地方调用了,所以很明显这种方案就不合适了,需要优化。百度了一下,找到如下两种优化方案:
方案一:
在layer弹出层中调用父界面重新加载函数
方案二:
调用layer插件的end回调方法:
end - 层销毁后触发的回调
类型:Function,默认:null
无论是确认还是取消,只要层被销毁了,end都会执行,不携带任何参数。
父窗口打开layer弹出框时,添加end回调
layer弹出框处理完成之后,就不需要调用其他刷新操作函数了,直接关闭就行了
相比较而言,第一种方案会更佳,因为在操作逻辑上,手动关闭弹出框,应该不触发刷新操作,只有当弹出框的处理逻辑执行成功后,调用函数关闭弹出框才触发父界面刷新操作,基于这个逻辑,应该选择方案一。方案二,不管怎样都会刷新页面,实际上无端的增加了服务器的处理压力。
方案二:可以解决子页面处理后的结果发送给子页面的父页面的问题。
对于layer.js出现回调关闭父类的弹出层时,之前的表单的submit失效的问题:
如何解决:网上有很多,有的是转为ajax的请求,在数据传输完再关闭父类的弹出层:
下面是关闭父弹出层的办法:
采用ajax这样可以,但是我做的是支付,要弹出页面才能支付,不能转换为ajax,怎么帮?后面我老大说:“你就不能晚点执行关闭吗”?这是一个想法试了一下就好了。
附上代码:
我还需要在关闭父类窗口后再打开一个窗口,则怎么解决,后面发现layer.js留有一个好的方式,那就是调用父窗口的方法,这个不受子窗口的影响,通过:parent.父类方法名(参数)这样就可以了,在父窗口中再调用layer.js的弹出就好了。
另:layui完整源码可点击此处本站下载。
希望本文所述对大家基于layui框架的程序设计有所帮助。
layui框架中layer父子页面交互的方法分析 本文实例讲述了layui框架中layer父子页面交互的方法。分享给大家供大家参考,具体如下:layer是一款近年来备受青睐的web弹层组件,官网地址是:
bootstrap 通过加减按钮实现输入框组功能 实现效果图如下:当我点击+按钮时,会添加一行输入框组;当点击-按钮时,会删除这一行输入框组html代码如下:divclass="input-group"id="centerIpGroup"labelclass
详解React Native 采用Fetch方式发送跨域POST请求 Fetch以后是趋势,势必要取代传统的Ajax,而且RN框架支持Fetch。下面仅做了一个跨域请求的例子,在本域请求是一样的,而且更简单一些。客户端环境用
标签: layer关闭当前窗口
本文链接地址:https://www.jiuchutong.com/biancheng/369804.html 转载请保留说明!友情链接: 武汉网站建设