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 28 Javascript
Bootstrap每天必学之表格
Nov 23 Javascript
javascript仿百度输入框提示自动下拉补全
Jan 07 Javascript
学习JavaScript设计模式之观察者模式
Apr 22 Javascript
Javascript类型转换的规则实例解析
Feb 23 Javascript
Javascript中Date类型和Math类型详解
Feb 27 Javascript
AngularJS模块详解及示例代码
Aug 17 Javascript
Vue.js每天必学之过渡与动画
Sep 06 Javascript
微信小程序 动态绑定事件并实现事件修改样式
Apr 13 Javascript
AngularJS基于factory创建自定义服务的方法详解
May 25 Javascript
AngularJS实现controller控制器间共享数据的方法示例
Oct 30 Javascript
浅谈关于iview表单验证的问题
Sep 29 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实现等比例不失真缩放上传图片的方法
2016/11/14 PHP
PHP实现向关联数组指定的Key之前插入元素的方法
2017/06/06 PHP
使用TextRange获取输入框中光标的位置的代码
2007/03/08 Javascript
js直接编辑当前cookie的脚本
2008/09/14 Javascript
Javascript跨域请求的4种解决方式
2013/03/17 Javascript
如何用JavaScript动态呼叫函数(两种方式)
2013/05/03 Javascript
jQuery实现div浮动层跟随页面滚动效果
2014/02/11 Javascript
PHP+MySQL+jQuery随意拖动层并即时保存拖动位置实例讲解
2015/10/09 Javascript
JavaScript实现in-place思想的快速排序方法
2016/08/07 Javascript
在线引用最新jquery文件的实现方法
2016/08/26 Javascript
vue树形结构获取键值的方法示例
2018/06/21 Javascript
微信小程序地图导航功能实现完整源代码附效果图(推荐)
2019/04/28 Javascript
Node.js实现用户评论社区功能(体验前后端开发的乐趣)
2019/05/09 Javascript
微信小程序去除左上角返回键的实现方法
2020/03/06 Javascript
Python利用itchat对微信中好友数据实现简单分析的方法
2017/11/21 Python
深入浅析Python中的yield关键字
2018/01/24 Python
python去除扩展名的实例讲解
2018/04/23 Python
python采集微信公众号文章
2018/12/20 Python
python变量赋值方法(可变与不可变)
2019/01/12 Python
Python爬虫beautifulsoup4常用的解析方法总结
2019/02/25 Python
Python小白必备的8个最常用的内置函数(推荐)
2019/04/03 Python
20行python代码的入门级小游戏的详解
2019/05/05 Python
python 抓包保存为pcap文件并解析的实例
2019/07/23 Python
Flask使用Pyecharts在单个页面展示多个图表的方法
2019/08/05 Python
Tensorflow训练MNIST手写数字识别模型
2020/02/13 Python
Python文件时间操作步骤代码详解
2020/04/13 Python
tensorflow下的图片标准化函数per_image_standardization用法
2020/06/30 Python
python regex库实例用法总结
2021/01/03 Python
selenium+headless chrome爬虫的实现示例
2021/01/08 Python
CSS3盒子模型详解
2013/04/24 HTML / CSS
html5 canvas合成海报所遇问题及解决方案总结
2017/08/03 HTML / CSS
印度电子产品购物网站:Vijay Sales
2021/02/16 全球购物
中专生自荐信
2014/06/25 职场文书
小学数学教研活动总结
2014/07/01 职场文书
餐饮食品安全责任书
2015/01/29 职场文书
个人借条范本
2015/05/25 职场文书