一、 layer.msg
-
实例1
layer.msg默认
layer.msg("修改完成");
-
实例2
layer.msg
layer.msg("修改完成", {
icon: 1,
time: 1000
},
function () {
// layer.msg里此函数不生效，layer.msg生效
document.location.reload();
})
-
实例3
有按钮
layer.msg("确认删除?", {
time: 0,
icon: 7,
btn: ["是", "否"],
yes: function (index) {
// 点击yes关闭msg弹窗，没有这句关闭代码，则不会自动关闭
layer.close(index);
$.ajax({
type: "POST",
url: "/jhgl/jhxg/deleteOneWuzi",
data: JSON.stringify(map),
contentType: "application/json",
async: false,
success: function (result) {
// 没有按钮
layer.msg("修改完成", {
icon: 1,
time: 1000
},
function () {
document.location.reload();
})
},
error: function (result) {
layer.alert('删除失败', {
icon: 5
});
}
});
}
});
二、layer.alert
-
实例1
layer.alert默认
layer.alert('内容')
-
实例2
image.png
layer.alert('见到你真的很高兴', {
icon: 6
});
三、layer.open
-
实例1
bootstrapTable编辑弹出框
"click #edit": function (e, value, row, index) {
layer.open({
title: '修改数量',
type: 1,
area: ['750px', '360px'],
content: $('#editDiv'),
closeBtn: 1,
btn: ['确认', '取消'],
yes: function (index) {
layer.close(index)
id = $('#id').val(),
jhsl = $('#jhsl').val(),
dj = $('#dj').val(),
je = dj * jhsl
var record={"id":id,"jhsl":jhsl,"je":je}
$.ajax({
type: "post",
url: "/jhgl/updateJhwz",
contentType: "application/json",
data: JSON.stringify(record),
dataType: "text",
success: function (result) {
layer.msg("修改完成", {
icon: 1,
},
function () {
document.location.reload();
})
},
error: function (result) {
layer.alert('修改失败', {
icon: 5
});
}
})
},
btn2: function () {
layer.alert(
"已取消", {
icon: 1,
time: 500
})
}
});
$("#id").val(row.id);
$("#wzmc").val(row.wzmc);
$("#dj").val(row.dj);
$("#jhsl").val(row.jhsl);
}
四、layer.prompt
-
实例1
prompt:formType:0 ,也是默认值
prompt:formType:1
prompt:formType:2
layer.prompt({
formType: 0, // 0是默认值，1是不明文显示值，2是大输入框
value: '初始值',
title: '标题'
}, function(value, index, elem){
alert(value); //得到value
layer.close(index);
});
-
实例2
layer.prompt:多个按钮
layer.prompt({
title: "是否给领导发送短信提醒?",
value: 123456,
btn: ['通过', '不通过','取消'],
btnAlign: 'c',
btn2: function(index, elem){
// 点击不通过得到value
var value = layui.jquery('#layui-layer'+index + " .layui-layer-input").val();
alert(value);
if (!value) {
return false; // 如果value为空，停止继续执行
}
layer.close(index);
},
}, function(value, index, elem){
alert(value); // 点击通过得到value
});
五、常用参数
- icon 图标
icon:1
icon:2
icon:3
icon:7
- closeBtn 右上角关闭按钮
- layer.msg默认为0
- layer.alert默认为1
- layer.prompt 默认为1
- 1显示，0不显示
右上角X号
- time 弹窗时间
- layer.msg 默认三秒关闭
- layer.alert 默认不关闭，可以设置
time:n，进行关闭。不自动关闭：time: 0- layer.open 点击确定不会关闭，需要调用
layer.close(index)进行关闭- layer.proment 点击确定不会关闭，需要调用
layer.close(index)进行关闭
- btn 按钮
- layer.msg默认无btn
- layer.alert默认一个
确定按钮- layer.prompt 默认一个
确认一个取消
- 自定义按钮
btn:['按钮1','按钮2'], // 自定义按钮组
btnAlign:'c', // 按钮居中
yes:function(){}, // 第一个按钮，也可以用btn1:function(){}来代替
btn2:function(){}, // 第二个按钮回调函数，以此类推
网友评论