layui弹出层layer
2018-11-27 21:07
351 查看
一、核心方法layer.open()
有type、title、content等一些与弹出层样式有关的属性
layer.open()基础属性
不管是使用哪种方式创建层,都是走layer.open(),创建任何类型的弹层都会返回一个当前层索引
var index = layer.open({ content: 'test' }); //拿到的index是一个重要的凭据,它是诸如layer.close(index)等方法的必传参数。
二、初始化全局配置layer.config(options)
可以用来配置层的默认参数(作用之一)
layer.config({ anim: 1, //默认动画风格 skin: 'layui-layer-molv' //默认皮肤 … });
三、初始化就绪 layer.ready(content,options,yes)
当页面打开时就加载
layer.ready(function(){ layer.msg('很高兴一开场就见到你'); });
四、普通信息框layer.alert(content,options,yes)
content是提示内容,options是基础参数,yes是回调函数
layer.alert( "回调加个图标", {icon: 1}, function(index){ layer.close(index) } )
五、询问框layer.confirm(content,options,yes,cancel)
类似layer.alert()
layer.confirm('是否删除?',{iocn: 3,title: '提示'},function(i){ layer.clone(i); })
六、提示框layer.msg(content,options,end)
弹出一个提示框0.8s后自动关闭
layer.msg("这是提示框",{offset: 't',time: 800},function(i){ console.log(i) })
七、加载层layer.load(icon,options)
load默认是不会自动关闭的,因为你一般会在ajax回调体中关闭它。也可以设置关闭时间
layer.load(2,{time: 1000});
八、提示语layer.tips(content,follow,options)
content是提示文本内容,follow是需要提示的标签id,options是基础参数
layer.tips("这是提示语",'#btn4',{tips: 1})
九、layer.close(index) - 关闭特定层
//当你想关闭当前页的某个层时 var index = layer.open(); var index = layer.alert(); var index = layer.load(); var index = layer.tips(); //正如你看到的,每一种弹层调用方式,都会返回一个index layer.close(index); //此时你只需要把获得的index,轻轻地赋予layer.close即可 //如果你想关闭最新弹出的层,直接获取layer.index即可 layer.close(layer.index); //它获取的始终是最新弹出的某个层,值是由layer内部动态递增计算的 //当你在iframe页面关闭自身时 var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引 parent.layer.close(index); //再执行关闭
十、layer.closeAll(type) - 关闭所有层
layer.closeAll(); //疯狂模式,关闭所有层 layer.closeAll('dialog'); //关闭信息框 layer.closeAll('page'); //关闭所有页面层 layer.closeAll('iframe'); //关闭所有的iframe层 layer.closeAll('loading'); //关闭加载层 layer.closeAll('tips'); //关闭所有的tips层
十一、layer.style(index, cssStyle) - 重新定义层的样式
//重新给指定层设定width、top等 layer.style(index, { width: '1000px', top: '10px' });
十二、layer.title(title, index) - 改变层的标题
layer.title('标题变了', index)
十三、layer.prompt(options, yes) - 输入层
options不仅可支持传入基础参数,还可以传入prompt专用的属性。当然,也可以不传。yes携带value 表单值index 索引elem 表单元素
//prompt层新定制的成员如下 { formType: 1, //输入框类型,支持0(文本)默认1(密码)2(多行文本) value: '', //初始时的值,默认空字符 maxlength: 140, //可输入文本的最大长度,默认500 } //例子1 layer.prompt(function(value, index, elem){ alert(value); //得到value layer.close(index); }); //例子2 layer.prompt({ formType: 2, value:'-', title:'备注' },function(v,i,e){ console.log(v); layer.clone(i); })
十四、layer.tab(options) - tab层
layer.tab({ area: ['600px', '300px'], tab: [{ title: 'TAB1', content: '内容1' }, { title: 'TAB2', content: '内容2' }, { title: 'TAB3', content: '内容3' }] });
相关文章推荐
- 关于layui-layer独立组件--弹出层
- layui-layer弹出层使用
- layui弹出层(layer)
- [置顶] [Layer] layui的弹出层用法记录
- Layui学习笔记--layer弹出层父子页面互相获取
- layui内置模块(layer弹出层)
- 使用layer,layui,不能显示弹出效果
- jQuery layer弹出层插件 http://layer.layui.com/直接上官网学
- 使用layui的layer组件做弹出层
- layui.layer 弹出层使用
- Layui 弹出层组件——layer
- Layui 弹出层组件——layer的模块化开发实例应用
- layui学习笔记——layer弹出层
- fastadmin: layer.open 弹出层如何在表单提交之后自动关闭?
- 前端开发:一款近年非常受欢迎、简单的WEB弹出层组件(layer)
- layer弹出层不居中解决方案,layer提示不屏幕居中解决方法,layer弹窗不居中解决方案
- layui 弹出层
- 关于layer.js 弹出框表单提交关闭父窗口出现表单提交失效的问题
- layer 弹出层回调
- layui 弹出框中select第二次无法显示问题