• layui layer 弹框


     layer 这个是一个web弹层组件,挺好用的...然后项目框架是SSM...


      layer.open主要是用来弹出来一个iframe弹窗,然后用来展示数据也行,用来修改也行,这次记录的主要是展示,展示我想要展示的数据,我需要的页面...

    复制代码
    layer.open({
         type: 1,
         title: '账户信息详情',
         shadeClose: true,
         shade: false,
         maxmin: true, //开启最大化最小化按钮
         area: ['893px', '600px'],
         content: xxxxxxxxx
    });
    复制代码

    其他的不看,单看content,因为content的内容就是需要展示的内容

    第一种方法,很简单,我想要看一个已经存在的页面,比如说百度,或者项目中某个页面 直接写地址

    复制代码
    layer.open({
          type: 2,
          title: '很多时候,我们想最大化看,比如像这个页面。',
          shadeClose: true,
          shade: false,
          maxmin: true, //开启最大化最小化按钮
          area: ['893px', '600px'],
          content: 'http://fly.layui.com/'
        });
    
    -----------------------------------------------------------------------
    
    layer.open({
          type: 2,
          title: '用户信息。',
          shadeClose: true,
          shade: false,
          maxmin: true, //开启最大化最小化按钮
          area: ['893px', '600px'],
          content: '/test/user/info' + uid
        });
    复制代码

     后面的uid可能是你需要传递的某些参数之类的...具体的根据你controller来定

    第二种方法,将需要的内容写到页面上,然后在使用的时候调用

    jsp页面:

    <div id='info' style = "display : none">
            我是内容
    </div>

    然后在js里面调用

    复制代码
    layer.open({
               type: 1,
               title: '账户信息详情',
               shadeClose: true,
               shade: false,
               maxmin: true, //开启最大化最小化按钮
               area: ['893px', '600px'],
               content: $("#info").html()
    });
    复制代码

    第三种方法,直接在js里面拼接...好凶残...

    复制代码
    var html = "<div class='wrapper' id='detailsinfo'>" +
               "<div class='detailsdiv'>" +
               "<p><label>帐号:</label>" + '测试帐号' +"</p>" +
               "</div></div>"
                                
    layer.open({
        type: 1,
        title: '账户信息详情',
        shadeClose: true,
        shade: false,
        maxmin: true, //开启最大化最小化按钮
        area: ['893px', '600px'],
        content: html
    });
    复制代码
  • 相关阅读:
    Windows Phone 7 中常用Task
    设置Highchart柱子最大宽度( 让 highcharts支持maxPointWidth属性)
    Asp.Net MVC 使用FileResult导出Excel数据文件
    js获取网页高度
    使用window.addEventListener 和 window.attachEvent 判断浏览器
    slimscroll滚动条插件简单用法
    js中如何快速获取数组中的最大值最小值
    js 判断浏览器类型
    python使用ldap进行用户认证
    关于go声明切片的一些疑问
  • 原文地址:https://www.cnblogs.com/yachao1120/p/10802709.html
Copyright © 2020-2023  润新知