Layer使用

先了解一下在web开发时候使用js要关闭弹出框的几个简单的应用
window.location.href、location.href 是本页面跳转
parent.location.href 是上一层页面跳转，也就是你在弹出时候的页面。
top.location.href是最外层的页面跳转，你懂得，在有iframe的时候你就知道他不会进入你的iframe的窗体
再就是你要从这个页面跳转到别的父级打开的页面window.parent.parent.location.href=“你定义要跳转的页面”

layer使用
本课题只探讨1.9以上的版本
看看基础参数项：调用时候用到的配置项如：layer.open({content: ''})layer.msg('', {time: 3})不需要所有都去配置，大多数都是可选的。其中layer.open、layer.msg是内置方法。
基础参数：
type - 基本层类型
type:Number，默认：0 5种提供层类型，信息框【0】，页面层【1】，iframe层【2】，加载层【3】，ips【4】层，若你采用layer.open({type: 1})方式调用，则type为必填项。
title：
title - 标题
类型：String/Array/Boolean，默认：'信息'
title支持三种类型的值，若你传入的是普通的字符串，如title :'我是标题'，那么只会改变标题文本；若你还需要自定义标题区域样式，那么你可以title: ['文本', 'font-size:18px;']，数组第二项可以写任意css样式；如果你不想显示标题栏，你可以title: false
content - 内容
类型：String/DOM/Array，默认：''
content可传入的值是灵活多变的，不仅可以传入普通的html内容，还可以指定DOM，更可以随着type的不同而不同。譬如：

/!*
 如果是页面层
 */
layer.open({
  type: 1, 
  content: '传入任意的文本或html' //这里content是一个普通的String
});
layer.open({
  type: 1,
  content: $('#id') //这里content是一个DOM
});
//Ajax获取
$.post('url', {}, function(str){
  layer.open({
    type: 1,
    content: str //注意，如果str是object，那么需要字符拼接。
  });
});

/!*
 如果是iframe层
 */
layer.open({
  type: 2, 
  content: 'http://sentsin.com' //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
}); 

/!*
 如果是用layer.open执行tips层
 */
layer.open({
  type: 4,
  content: ['内容', '#id'] //数组第二项即吸附元素选择器或者DOM
});

skin - 样式类名
类型：String，默认：''
skin不仅允许你传入layer内置的样式class名，还可以传入您自定义的class名。这是一个很好的切入点，意味着你可以借助skin轻松完成不同的风格定制。目前layer内置的skin有：layui-layer-lanlayui-layer-molv，未来我们还会选择性地内置更多，但更推荐您自己来定义。以下是一个自定义风格的简单例子

来源http://layer.layui.com/api.html#layer.load

猜你喜欢