layer弹出层全屏及关闭方法


Posted in Javascript onAugust 17, 2018

一、首先引用JS文件

<script src="../../js/common/layer/layer.js"></script>

二、全屏调用以下代码

var index = layer.open({
 type: 2,
 content: url,
 area: ['300px', '195px'], 
 title: false,
 maxmin: true, 
 closeBtn: 0
    });
layer.full(index);

三、关闭弹出层

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

总结:

这种打开的页面的好处是:直接关闭当前弹出层,不用刷新整个页面,不用加载数据,性能高,节约时间,缺点是查询参数的传输不方便。

补充:

这种写法产地参数十分的不方便,试过array方式传参解读过去的都是object根本不是想要的数据,而json格式数据因为里面带有引号只会传递部分数据,我在这里总结了一个方法,从几种方法里面选的一个相对较好的传参方式:

[{"name":"periodstart","value":"2014-01"},{"name":"periodend","value":"2014-12"},{"name":"fkcategory","value":""},{"name":"fkCategoryName","value":""},{"name":"fkmandept","value":""},{"name":"fkMandeptName","value":""},{"name":"fkusedept","value":""},{"name":"fkUsedeptName","value":""},{"name":"pkcurrtype","value":""},{"name":"total","value":""}]
JSON.stringify($('#searchForm').serializeArray()).replace(/"+/g,'').replace(/name:/g,'').replace(/,value:/g,'=').replace(/},{/g,',');

这是先将一个form表单里面的数据序列化出来,然后转为json格式,然后将json格式的数据转为map避免json数据里面引号对数据的传递影响,然后在后台直接在后台强转为map格式的数据,非常方便。

Map<String, String> map = new HashMap<String, String>();
 String data = "{periodstart=2014-01,periodend=2014-12,fkcategory=,"
 + "fkCategoryName=,fkmandept=,fkMandeptName=,fkusedept=,fkUsedeptName=,pkcurrtype=,total=}";;
 data = data.substring(1, data.length()-1);//去掉前后括号
 String[] arraydata = data.split(",");//按“,”将其分为字符数组
 for (int i = 0; i < arraydata.length; i++) {
  int j = arraydata[i].indexOf("=");
  map.put(arraydata[i].substring(0, j-1), arraydata[i].substring(j+1, arraydata[i].length()));
 }
 Object o = map.get("perioden");
 System.out.println(o.toString());
{periodstart=2014-01,periodend=2014-12,fkcategory=,fkCategoryName=,fkmandept=,fkMandeptName=,fkusedept=,fkUsedeptName=,pkcurrtype=,total=}

以上这篇layer弹出层全屏及关闭方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery EasyUI API 中文文档 - DataGrid数据表格
Nov 17 Javascript
DIV+CSS+JS不间断横向滚动实现代码
Mar 19 Javascript
取消选中单选框radio的三种方式示例介绍
Dec 23 Javascript
Jquery插件easyUi表单验证提交(示例代码)
Dec 30 Javascript
node.js中的fs.linkSync方法使用说明
Dec 15 Javascript
jQuery插件MixItUp实现动画过滤和排序
Apr 12 Javascript
利用Angularjs和Bootstrap前端开发案例实战
Aug 27 Javascript
微信小程序模板之分页滑动栏
Feb 10 Javascript
小程序多图列表实现性能优化的方法步骤
May 28 Javascript
React实现阿里云OSS上传文件的示例
Aug 10 Javascript
JS如何生成动态列表
Sep 22 Javascript
微信小程序实现锚点跳转
Nov 23 Javascript
vue+iview+less 实现换肤功能
Aug 17 #Javascript
jquery实现的简单轮播图功能【适合新手】
Aug 17 #jQuery
layer弹出的iframe层在执行完毕后关闭当前弹出层的方法
Aug 17 #Javascript
vue实现element-ui对话框可拖拽功能
Aug 17 #Javascript
原生JS实现的简单轮播图功能【适合新手】
Aug 17 #Javascript
layer.confirm取消按钮绑定事件的方法
Aug 17 #Javascript
LayerClose弹窗关闭刷新方法
Aug 17 #Javascript
You might like
php 获取当前访问的url文件名的方法小结
2010/02/08 PHP
PHP自动选择 连接本地还是远程数据库
2010/12/02 PHP
PHP JS Ip地址及域名格式检测代码
2013/09/27 PHP
WordPress用户登录框密码的隐藏与部分显示技巧
2015/12/31 PHP
捕获关闭窗口的脚本
2009/01/10 Javascript
url参数中有+、空格、=、%、&amp;、#等特殊符号的问题解决
2013/05/15 Javascript
jquery获取一组checkbox的值(实例代码)
2013/11/04 Javascript
使用JavaScript实现网页版Pongo设计思路及源代码分享
2014/06/16 Javascript
json+jQuery实现的无限级树形菜单效果代码
2015/08/27 Javascript
JS工作中的小贴士之”闭包“与事件委托的”阻止冒泡“
2016/06/16 Javascript
Node.js读取文件内容示例
2017/03/07 Javascript
微信小程序 设置启动页面的两种方法
2017/03/09 Javascript
从零开始学习Node.js系列教程四:多页面实现的数学运算示例
2017/04/13 Javascript
jQuery日期范围选择器附源码下载
2017/05/23 jQuery
JS+canvas绘制的动态机械表动画效果
2017/09/12 Javascript
解决vue 更改计算属性后select选中值不更改的问题
2018/03/02 Javascript
Vue中&quot;This dependency was not found&quot;问题的解决方法
2018/06/19 Javascript
vue通过cookie获取用户登录信息的思路详解
2018/10/30 Javascript
关于vue里页面的缓存详解
2019/11/04 Javascript
[02:00]最后,我终于出了辉耀
2018/03/27 DOTA
[01:25:33]完美世界DOTA2联赛PWL S3 INK ICE vs Magma 第二场 12.20
2020/12/23 DOTA
Python实现注册、登录小程序功能
2018/09/21 Python
Python使用post及get方式提交数据的实例
2019/01/24 Python
python selenium 弹出框处理的实现
2019/02/26 Python
django query模块
2019/04/20 Python
Django中Middleware中的函数详解
2019/07/18 Python
pytorch .detach() .detach_() 和 .data用于切断反向传播的实现
2019/12/27 Python
新年福利来一波之Python轻松集齐五福(demo)
2020/01/20 Python
专科应届生求职信
2013/11/24 职场文书
国贸专业的职业规划书
2014/03/15 职场文书
2014预备党员党课学习心得范文
2014/07/08 职场文书
解除劳动关系协议书范文
2014/09/11 职场文书
普通党员个人剖析材料
2014/10/08 职场文书
党员检讨书
2014/10/13 职场文书
男生贾里读书笔记
2015/06/30 职场文书
redis 解决库存并发问题实现数量控制
2022/04/08 Redis