layui组件layer弹窗设置

layui.use(['layer', 'form'], function(){
	var layer = layui.layer,form = layui.form;
	layer.open({
		id:'add',//设置该值后,不管是什么类型的层,都只允许同时弹出一个。一般用于页面层和iframe层模式
		title:'标题',//设置弹出框上部标题
		skin: 'none',//layui-layer-molv layui-layer-lan	layui-layer-rim
		type: 2,//0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层)
		content: 'http://www.baidu.com',//不想让iframe出现滚动条,可以content: ['http://sentsin.com', 'no']
		area: ['500px', '300px'],//弹窗的长宽 默认auto时 maxWidth - 最大宽度 maxHeight - 最大高度
		offset: 'auto',//默认坐标,即垂直水平居中 默认auto
		shade:0.3,//遮罩层透明度 0-1 默认0.3
		shadeClose:true,//是否点击遮罩层关闭弹窗 默认false
		closeBtn:1, //右上角关闭按钮样式 一共两种分别为1 2 默认1
		btn: ['bt1', 'bt2'], //按钮文字
		btnAlign: 'r',//r按钮右对齐  l按钮左对齐 c按钮居中对齐  默认r
		btn1: function(index, layero){
			//按钮【bt1】的回调
			alert(1);
		}, 
		btn2: function(index,layero){
			//按钮【bt2】的回调
			alert(2);
			return false //开启该代码可禁止点击该按钮关闭
		},
		time: 0,//自动关闭时间 1000=1秒 默认0
		anim:0,//弹出动画,目前anim可支持的动画类型有0-6 如果不想显示动画,设置 anim: -1 即可。 默认0
		maxmin:true,//该参数值对type:1和type:2有效。最大最小化按钮。 默认false
		fixed:true,//即鼠标滚动时,层是否固定在可视区域  默认true
		resize:true,//是否允许在弹层右下角拖动来拉伸尺寸  默认true
		scrollbar:true,//是否允许浏览器出现滚动条  默认true
		zIndex:19891014,//层叠顺序 默认:19891014(贤心生日 0.0)
		success: function(layero, index){//层弹出后的成功回调方法
			//console.log(layero, index);
			alert('弹出成功');
		},
		yes: function(index,layero){//确定按钮回调方法
			//do something
			alert('确定按钮');//如果设定了yes回调,需进行手工关闭
		},
		cancel: function(index, layero){//右上角关闭按钮触发的回调,两个参数,分别为:当前层索引参数(index)、当前层的DOM对象(layero)
			if(confirm('确定要关闭么')){ //只有当点击confirm框的确定时,该层才会关闭
				layer.close(index);
			}
			return false; 
		} 

	});
})

layui所有组件的官方文档网址https://www.layui.com/doc/modules/layer.html

  • 1
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值