jQuery、layer实现弹出层的打开、关闭功能


Posted in jQuery onJune 28, 2017

打开弹出层:

在list页面带入layer.js 

在list页面点击时,弹出form弹出层,list.js:

$(".add_category,.update").click(function(){  
    //弹出框  
    var doMain = $('.domain_name').val();  
    layer.open({  
      shade: [0.5, '#000', false],  
      type: 2,  
      area: ['900px', '530px'],  
      fix: false, //不固定  
      maxmin: true,  
      title: ['添加或修改用户类型', false],  
      content: doMain+"/Stat/QueryUserCategoryForm.action?adminUserCategory.id="+$(this).val()  
    });  
  });

在点击form弹出层的“保存”按钮时,如果保存数据成功,则关闭弹出层,并且刷新list页面:

<span style="color:#000099;">submitHandler: function (form){  
      $.post(  
        $('.domain_name').val()+"/Stat/AddOrUpdateUserCategory.action",  
        $(form).serialize(),  
        function(data){  
          var result = eval("("+data+")");  
          if(!result.status){  
            alert(result.message);  
          }else{  
            //添加数据成功,关闭弹出窗之前,刷新列表页面的数据  
            parent.window.location.href=$('.domain_name').val()+"/Stat/QueryUserCategoryListStat.action";  
            </span><span style="color:#ff6666;"> var index = parent.layer.getFrameIndex(window.name); //获取窗口索引  
            parent.layer.close(index); </span><span style="color:#000099;"> 
          }  
        }  
      );  
    } </span>

以上所述是小编给大家介绍的jQuery、layer实现弹出层的打开、关闭功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jQuery树插件zTree使用方法详解
May 02 jQuery
jQuery序列化后的表单值转换成Json
Jun 16 jQuery
jQuery.Form实现Ajax上传文件同时设置headers的方法
Jun 26 jQuery
使用vue与jquery实时监听用户输入状态的操作代码
Sep 19 jQuery
原生JS与jQuery编写简单选项卡
Oct 30 jQuery
jQuery实现的简单无刷新评论功能示例
Nov 08 jQuery
jQuery滚动条美化插件nicescroll简单用法示例
Apr 18 jQuery
jQuery实现参数自定义的文字跑马灯效果
Aug 15 jQuery
jQuery超简单遮罩层实现方法示例
Sep 06 jQuery
jQuery层叠选择器用法实例分析
Jun 28 jQuery
详解webpack引用jquery(第三方模块)的三种办法
Aug 21 jQuery
jQuery实现简易QQ聊天框
Feb 10 jQuery
各种选择框jQuery的选中方法(实例讲解)
Jun 27 #jQuery
基于jQuery封装的分页组件
Jun 26 #jQuery
jQuery.Form实现Ajax上传文件同时设置headers的方法
Jun 26 #jQuery
jQuery实现一个简单的验证码功能
Jun 26 #jQuery
jQuery+C#实现参数RSA加密传输功能【附jsencrypt.js下载】
Jun 26 #jQuery
jQuery实现frame之间互通的方法
Jun 26 #jQuery
jQuery回调方法使用示例
Jun 26 #jQuery
You might like
PHP5 面向对象(学习记录)
2009/12/02 PHP
PHP lcfirst()函数定义与用法
2019/03/08 PHP
Laravel使用模型实现like模糊查询的例子
2019/10/24 PHP
js控制的回到页面顶端goTop的代码实现
2013/03/20 Javascript
js的[defer]和[async]属性
2014/11/24 Javascript
如何用js判断dom是否有存在某class的值
2017/02/13 Javascript
js通过keyCode值判断单击键盘上某个键,然后触发指定的事件方法
2017/02/19 Javascript
基于bootstrap按钮式下拉菜单组件的搜索建议插件
2017/03/25 Javascript
d3.js入门教程之数据绑定详解
2017/04/28 Javascript
利用forever和pm2部署node.js项目过程
2017/05/10 Javascript
解决JSON.stringify()自动将中文转译成unicode的问题
2018/01/05 Javascript
加速vue组件渲染之性能优化
2020/04/09 Javascript
Django REST为文件属性输出完整URL的方法
2017/12/18 Python
Python多线程threading和multiprocessing模块实例解析
2018/01/29 Python
Python实现简单遗传算法(SGA)
2018/01/29 Python
Python 中的lambda函数介绍
2018/10/10 Python
python+mysql实现教务管理系统
2019/02/20 Python
Python中模块(Module)和包(Package)的区别详解
2019/08/07 Python
Python调用shell命令常用方法(4种)
2020/05/11 Python
如何使用scrapy中的ItemLoader提取数据
2020/09/30 Python
Python WebSocket长连接心跳与短连接的示例
2020/11/24 Python
基于CSS3实现的漂亮Menu菜单效果代码
2015/09/10 HTML / CSS
澳大利亚新奇小玩意网站:Yellow Octopus
2017/12/28 全球购物
工业学校毕业生自荐信范文
2014/01/03 职场文书
航海技术专业毕业生求职信
2014/04/06 职场文书
勤奋学习演讲稿
2014/05/10 职场文书
优秀学生干部个人事迹材料
2014/06/02 职场文书
甘南现象心得体会
2014/09/11 职场文书
工作会议简报
2015/07/20 职场文书
2016大一新生入学教育心得体会
2016/01/23 职场文书
Nginx + consul + upsync 完成动态负载均衡的方法详解
2021/03/31 Servers
mybatis调用sqlserver存储过程返回结果集的方法
2021/05/08 SQL Server
Win11软件图标固定到任务栏
2022/04/19 数码科技
台积电称即便经济低迷也没有降价的计划
2022/04/21 数码科技
python解析json数据
2022/04/29 Python
Python3使用Qt5来实现简易的五子棋小游戏
2022/05/02 Python