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

本文主要介绍了jQuery、layer实现弹出层的打开、关闭功能,需要的朋友可以参考下,希望能帮助到大家。

 

打开弹出层:

在list页面带入layer.js 

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

1

2

3

4

5

6

7

8

9

10

11

12

13

$(".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页面:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

<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>

posted @   雪莉06  阅读(1884)  评论(0编辑  收藏  举报
编辑推荐:
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
阅读排行:
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 单元测试从入门到精通
历史上的今天:
2017-11-29 移动端rem切图
点击右上角即可分享
微信分享提示