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 相关文章推荐
JavaScript 计算当天是本年本月的第几周
Mar 22 Javascript
Juqery Html(),append()等方法的Bug解决方法
Dec 13 Javascript
ASP.NET jQuery 实例11 通过使用jQuery validation插件简单实现用户登录页面验证功能
Feb 03 Javascript
JavaScript控制table某列不显示的方法
Mar 16 Javascript
jQuery鼠标事件汇总
Aug 30 Javascript
jQuery Easyui 验证两次密码输入是否相等
May 13 Javascript
深入理解JS中的Function.prototype.bind()方法
Oct 11 Javascript
angular学习之从零搭建一个angular4.0项目
Jul 10 Javascript
jquery实现回车键触发事件(实例讲解)
Nov 21 jQuery
vue实现城市列表选择功能
Jul 16 Javascript
vue中使用better-scroll实现滑动效果及注意事项
Nov 15 Javascript
vue中英文切换实例代码
Jan 21 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 UTF-8、Unicode和BOM问题
2010/05/18 PHP
Php中使用Select 查询语句的实例
2014/02/19 PHP
分享PHP源码批量抓取远程网页图片并保存到本地的实现方法
2015/12/01 PHP
JavaScript 原型学习总结
2010/10/29 Javascript
解决jquery submit()提交表单提示:f[s] is not a function
2013/01/23 Javascript
js作用域及作用域链概念理解及使用
2013/04/15 Javascript
jQuery中ajax和post处理json的不同示例对比
2014/11/02 Javascript
JavaScript中用于四舍五入的Math.round()方法讲解
2015/06/15 Javascript
基于jquery实现一个滚动的分步注册向导-附源码
2015/08/26 Javascript
jQuery超精致图片轮播幻灯片特效代码分享
2015/09/10 Javascript
跟我学习javascript的闭包
2015/11/16 Javascript
javascript结合Flexbox简单实现滑动拼图游戏
2016/02/18 Javascript
jQuery Validate表单验证插件的基本使用方法及功能拓展
2017/01/04 Javascript
Bootstrap与Angularjs的模态框实例代码
2017/08/03 Javascript
input type=file 选择图片并且实现预览效果的实例
2017/10/26 Javascript
对vue中methods互相调用的方法详解
2018/08/30 Javascript
关于node-bindings无法在Electron中使用的解决办法
2018/12/18 Javascript
详解服务端预渲染之Nuxt(介绍篇)
2019/04/07 Javascript
浅谈Vuex注入Vue生命周期的过程
2019/05/20 Javascript
[50:11]2018DOTA2亚洲邀请赛 4.7总决赛 LGD vs Mineski 第三场
2018/04/09 DOTA
[36:09]Secret vs VG 2019国际邀请赛淘汰赛 败者组 BO3 第一场 8.24
2019/09/10 DOTA
实例讲解Python爬取网页数据
2018/07/08 Python
Python Pandas数据中对时间的操作
2019/07/30 Python
Scrapy框架基本命令与settings.py设置
2020/02/06 Python
python 实现批量图片识别并翻译
2020/11/02 Python
html5 Canvas画图教程(5)—canvas里画曲线之arc方法
2013/01/09 HTML / CSS
浅析canvas元素的html尺寸和css尺寸对元素视觉的影响
2019/07/22 HTML / CSS
德国消费电子产品购物网站:Guter Kauf
2020/09/15 全球购物
旅游管理本科生求职信
2013/10/14 职场文书
医院门卫岗位职责
2013/12/30 职场文书
《胡杨》教学反思
2014/02/16 职场文书
出纳员的岗位职责
2014/02/22 职场文书
机关党员四风问题个人整改措施
2014/10/26 职场文书
社区党员群众路线教育实践活动心得体会
2014/11/03 职场文书
创先争优活动个人总结
2015/03/04 职场文书
Redis延迟队列和分布式延迟队列的简答实现
2021/05/13 Redis