最近在做一个后台项目,正好碰上了要使用layer.open,就顺手记录一下,方便以后遇到了有个参考 - 2016/11/7


  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
});

我现在使用的就是这三种方法,也许还有更好的方法,以后发现了再记录

对于方法一:因为是使用已经存在的controller和页面,所以传值什么都比较方便,需要什么值就获取什么值传递什么值...但是有些页面可能我不想让别人通过url直接就访问到...那就可以用第二种和第三种...所需的数据直接通过ajax从后台获取到,然后再放到具体的位置,然后再展示~~

使用layer.open时content属性传值记录的更多相关文章

  1. #学习记录#——CSS content 属性

    CSS content 属性常结合:before 和:after 这两个伪类一起使用,给指定的元素添加内容来丰富页面. 1. 添加文本内容 html: <h1>给末尾添加内容. </ ...

  2. CSS魔法堂:一起玩透伪元素和Content属性

    前言  继上篇<CSS魔法堂:稍稍深入伪类选择器>记录完伪类后,我自然而然要向伪元素伸出"魔掌"的啦^_^.本文讲讲述伪元素以及功能强大的Contet属性,让我们可以通 ...

  3. 四大传值详解:属性传值,单例传值,代理传值,block传值

    一:属性传值 传值情景:从前一个页面向后一个页面传值 a.在后一个页面,根据传值类型和个数,写属性 b.在前一个页面, 为属性赋值 c.在后一个页面, 使用值 例如: 第一个视图: #import & ...

  4. 属性传值,协议传值,block传值,单例传值四种界面传值方式

    一.属性传值 对于属性传值而言,相对于其它的三种 方法来说,是最基础,最简单的一种 方法,但,属性传值 有很大的局限性,因为是适用于第一个界面向第二个界面传 值,第二个向第三个界面传值等等.N界面向N ...

  5. Easyui tabs的herf和content属性

    在backstage.jsp页面中我写了一个方法,用于在指定位置添加面板(id为msg的地方)function addTab(t,h){ if($('#msg').tabs('exists',t)){ ...

  6. 在使用cognos时遇到的问题记录帖

    在使用cognos时遇到的问题记录帖 1.开一个project 报无法访问位于 URL 的服务: http://localhost:80/ibmcognos/cgi-bin/cognos.cgi?b_ ...

  7. CSS3使用content属性来插入项目编号

    首先可以使用before选择器与after选择器的content属性在元素的前面或者后面插入文字和图像,这里我记录的是利用这个content属性来在项目前插入项目编号,同时可以利用content属性在 ...

  8. 浅析requests库响应对象的text和content属性

    在做爬虫时请求网页的requests库是必不可少的,我们常常会用到 res = resquests.get(url) 方法,在获取网页的html代码时常常使用res的text属性: html = re ...

  9. MyBatis 插入时返回刚插入记录的主键值

    MyBatis 插入时返回刚插入记录的主键值 一.要求: 1.数据库表中的主键是自增长的,如:id: 2.获取刚刚插入的记录的id值: 二.源代码: 1.User.java package cn.co ...

随机推荐

  1. escape(), encodeURI()和encodeURIComponent()(转)

      escape(), encodeURI()和encodeURIComponent()是在Javascript中用于编码字符串的三个常用的方法,而他们之间的异同却困扰了很多的Javascript初学 ...

  2. ThinkPHP 下如何隐藏index.php

    最近一直在做孕妈团的项目,因为部署到实际项目中出现了链接打不开的情况,要默认添加index.php才能正常访问. 当时忘了是Tinkphp的URL重写模式:以后遇到相同问题,首先要想到URL重写模式. ...

  3. IE9浏览器中的My97日历控件刷新后无法打开问题解决办法

    解决办法如下: 1:找到WdatePicker.js 2:将$crossFrame:true 改为$crossFrame:false. 3:重启服务,刷新页面发现OK.

  4. python 学习(二)--关于类

    1.没有权限控制,在类方法或变量前加 "__" 两下划线,则变为"私有"变量(实际通过_<类名>__<变量或方法名> 可以访问) 2.类 ...

  5. tomcat输出servlet-api.jar - jar not loaded 解决办法

    tomcat输出servlet-api.jar - jar not loaded 解决办法 启动tomcat后,控制台输出信息:WEB-INF/lib/servlet-api.jar not load ...

  6. 字符转换(C、C++)

    标准C和C++库提供了一些转换工具.但是它们在易用性.扩展型和安全型上各有不同. 例如,以atoi为代表的一系列标准C函数就有一些限制: * 只支持单向转换:从文本到内部数据类型.要用C库函数实现另一 ...

  7. Upload Images

    ASP.NET图片批量上传,可预览带进度条 http://www.okbase.net/file/item/5492

  8. 【转】SVN添加文件时的错误处理:...\conf\svnserve.conf:12: Option expected

    转载地址:http://www.linuxidc.com/Linux/2014-09/106683.htm 安装完SVN服务器,添加完用户权限后,准备将本地的项目add到服务器上时,报"C: ...

  9. java开发中中文乱码总结

    1.jsp页面内容显示乱码 这种乱码原因很简单,一般的工具或解码程序对中文字符解析时采用默认的解码方式: <%@ page contentType="text/html; charse ...

  10. input标签file的value属性IE兼容性问题

    在IE中input标签file的value属性是只读的,不能通过js来改变,如下代码在IE中就是无效的: var input = document.getElementById('file'); in ...