首先明确的是在content里面可以添加可以传入普通的html内容,也可以添加dom元素。当你在往content里面添加一个dom元素的时候,有可能碰到弹出框的按钮关闭不了,这时候你金额已根据btn数组的长度,第一个默认是yes函数,第二个默认是cancel函数,如果你写的是btn:["a","b","c"],你要给c按钮添加函数就写btn3:function(){}即可。
layui.use('layer', function(){
var $ = layui.jquery, layer = layui.layer; //独立版的layer无需执行这一句 var othis = $(this); var type = othis.data('type'), text = othis.text(); layer.open({ title :'详情' ,type: 1 ,area: [widthDom+"px",height+"px"] ,offset: type ,id: 'tongjiLay'+type //防止重复弹出 ,content:$("#tongjiLay"),btnAlign: 'c' //按钮居中
,offset: ['140px', '330px']
,btn: ['关闭','保存'] ,btn2:function(){ $("#tongjiLay").css('display','none'); layer.closeAll(); } ,cancel:function(){ $("#tongjiLay").css('display','none'); layer.closeAll(); } ,offset: ['140px', '330px'] ,shade: 0 ,yes: function(){ $("#tongjiLay").css('display','none'); layer.closeAll(); } });});
其中里面关于弹出框的宽高area里面的值是可以用传参的方式赋值,而距离上左(top,left)的距离,可以 通过offset来设置的。还有值得注意的是里面的type的值不一样,弹出的形式就不一样,其属性值有:0(信息框,默认)1(页面层)2(iframe层)3(加载层)4(tips层)。layer.open({type: 1})方式调用,其中type为必填值。