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读取ASP设定的COOKIE
Nov 24 Javascript
JavaScript网页制作特殊效果用随机数
May 22 Javascript
javascript中使用replaceAll()函数实现字符替换的方法
Dec 25 Javascript
javascript中加号(+)操作符的一些神奇作用
Jun 06 Javascript
使用JavaScript实现弹出层效果的简单实例
May 31 Javascript
使用JavaScript判断用户输入的是否为正整数(两种方法)
Feb 05 Javascript
jQuery插件FusionCharts绘制2D环饼图效果示例【附demo源码】
Apr 10 jQuery
深入理解vue.js中的v-if和v-show
Jun 22 Javascript
vue-router传参用法详解
Jan 19 Javascript
JS实现checkbox互斥(单选)功能示例
May 04 Javascript
VUE.CLI4.0配置多页面入口的实现
Nov 25 Javascript
在Vue中使用mockjs代码实例
Nov 25 Vue.js
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
[EPIC] Larva vs Flash ZvT @ Crossing Field [2017-10-09]
2020/03/17 星际争霸
解析PHP中的正则表达式以及模式匹配
2013/06/19 PHP
解析在PHP中使用全局变量的几种方法
2013/06/24 PHP
PhpDocumentor 2安装以及生成API文档的方法
2014/05/21 PHP
cakephp2.X多表联合查询join及使用分页查询的方法
2017/02/23 PHP
thinkphp3.2实现跨控制器调用其他模块的方法
2017/03/14 PHP
php实现socket推送技术的示例
2017/12/20 PHP
TNC vs IO BO3 第二场2.13
2021/03/10 DOTA
thinkphp中常用的系统常量和系统变量
2014/03/05 Javascript
深入剖析JavaScript中的枚举功能
2014/03/06 Javascript
javascript实现阻止iOS APP中的链接打开Safari浏览器
2014/06/12 Javascript
AngualrJS中的Directive制作一个菜单
2016/01/26 Javascript
js将当前时间格式化为 年-月-日 时:分:秒的实现代码
2018/01/20 Javascript
如何正确理解vue中的key详解
2019/11/02 Javascript
[44:39]2014 DOTA2国际邀请赛中国区预选赛 NE VS CNB
2014/05/21 DOTA
编写同时兼容Python2.x与Python3.x版本的代码的几个示例
2015/03/30 Python
浅谈Python 集合(set)类型的操作——并交差
2016/06/30 Python
Python常用模块之requests模块用法分析
2019/05/15 Python
简单了解python代码优化小技巧
2019/07/08 Python
django中media媒体路径设置的步骤
2019/11/15 Python
python实现替换word中的关键文字(使用通配符)
2020/02/13 Python
详解用Python进行时间序列预测的7种方法
2020/03/13 Python
简单了解python调用其他脚本方法实例
2020/03/26 Python
jupyter notebook 恢复误删单元格或者历史代码的实现
2020/04/17 Python
django Layui界面点击弹出对话框并请求逻辑生成分页的动态表格实例
2020/05/12 Python
Kmeans均值聚类算法原理以及Python如何实现
2020/09/26 Python
python 爬取腾讯视频评论的实现步骤
2021/02/18 Python
Furla官网:意大利著名的皮革品牌
2019/08/06 全球购物
小学教师的个人自我鉴定
2013/10/24 职场文书
市场调查策划方案
2014/06/10 职场文书
应聘教师自荐书
2014/06/16 职场文书
加薪通知
2015/04/25 职场文书
结婚主持人致辞
2015/07/28 职场文书
小学班级管理心得体会
2016/01/07 职场文书
学习杨善洲同志先进事迹心得体会
2016/01/23 职场文书
《观察物体》教学反思
2016/02/17 职场文书