alertmsg 变量值_layer弹出层框架alert与msg详解

layer--->web弹层组件

代码:

1 layer.alert('见到你真的很高兴', {icon: 6});

这是一个最简单的弹出层,可根据icon配置左边的图标

通常情况下,除了弹窗之外我们一般都会有对按钮做回调处理的一些操作

如图:

1 layer.alert('墨绿风格，点击确认看深蓝', {

2 skin: 'layui-layer-molv' //样式类名 自定义样式

3 ,closeBtn: 1 // 是否显示关闭按钮

4 ,anim: 1 //动画类型

5 ,btn: ['重要','奇葩'] //按钮

6 ,icon: 6 // icon

7 ,yes:function(){

8 layer.msg('按钮1')

9 }

10 ,btn2:function(){

11 layer.msg('按钮2')

12 }});

13

code:

1 layer.msg('大部分参数都是可以公用的
合理搭配，展示不一样的风格', {

2 time: 2000, //2s后自动关闭

3 btn: ['明白了', '知道了', '哦']

4 });

回调的例子:

code:

1 layer.msg('也可以这样', {

2 btn: ['明白了', '知道了']

3 ,yes: function(index, layero){

4 layer.msg("按钮1回调,参数是:"+index)

5 }

6 ,btn2: function(index, layero){

7 //按钮【按钮二】的回调

8 layer.msg("按钮2回调,参数是:"+index)

9 return false //开启该代码可禁止点击该按钮关闭

10 }

11 });

open方式

code

1 layer.open({

2 type: 1

3 ,title: "open方式弹出层" //不显示标题栏 title : false/标题

4 ,closeBtn: true

5 ,area: '300px;'

6 ,shade: 0.8

7 ,id: 'LAY_layuipro' //设定一个id，防止重复弹出

8 ,resize: false

9 ,btn: ['火速围观', '残忍拒绝']

10 ,btnAlign: 'c'

11 ,moveType: 1 //拖拽模式，0或者1

12 ,content: '

内容
内容

'

13 ,success: function(layero){

14 var btn = layero.find('.layui-layer-btn');

15 btn.find('.layui-layer-btn0').attr({

16 href: 'http://www.layui.com/'

17 ,target: '_blank'

18 });

19 }

20 });

layer.msg

语法：layer.msg(content[, options][, end]) 提示框

layer.msg('这里是msg内容');

layer.msg('这里是msg内容',{icon:1});

layer.msg('关闭后想做些什么', function(){

//do something

});

layer.msg('同上', {

icon:1,

time:2000 //2秒关闭(如果不配置，默认是3秒)

},function(){

//do something

});

layer.alert

语法：layer.alert(content[, options][, yes]) 普通信息框

//eg1

layer.alert('只想简单的提示');

//eg2

layer.alert('加了个图标', {icon: 1}); //这时如果你也还想执行yes回调，可以放在第三个参数中。

//eg3

layer.alert('有了回调', function(index){

//do something

layer.close(index);

});

layer.confirm

语法：layer.confirm(content[, options], yes[, cancel]) 询问框

//eg1

layer.confirm('is not?', {icon: 3, title:'提示'}, function(index){

//do something

layer.close(index);

});

//eg2

layer.confirm('is not?', function(index){

//do something

layer.close(index);

});

layer.propmt

语法：layer.prompt([options,] yes) 输入层/询问层

//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:'这里是title'

},function(value, index, elem){

alert(value);//得到value

layer.close(i