Layui 弹窗 - layer.msg（提示框）

最新推荐文章于 2023-05-25 00:06:41 发布

llettod

最新推荐文章于 2023-05-25 00:06:41 发布

阅读量1w

点赞数

原文链接：https://www.cnblogs.com/libin6505/p/10881817.html

版权

<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>开始使用layui</title>
<link rel="stylesheet" href="/css/layui.css">
</head>
<script type="text/javascript" src="layui/layui.all.js"></script>
<script type="text/javascript" src="js/jquery-1.11.0.min.js"></script>

<body>

<div>
aa
</div>
<button id="start" data-method="setTop" class="layui-btn">显示弹出层</button>

$(function(){

//打开弹窗
$("#start").on("click",function(){
f5();
});
});

//单个确认按钮（常用）
function f7(){
layer.alert("aa");
}

//确认、取消按钮（常用）
function f6(){
layer.confirm('is not?', {icon: 3, title:'提示'}, function(index){
//do something
alert("aa")
layer.close(index);
});
}

//自动消失提示（常用）
function f7(){
layer.msg("aa");
}


//单个按钮
function f5(){
layer.open({
content: 'test'
,btn: ['按钮一']

});
}

//下面仅供参考

//多个确认按钮
function f2(){
layer.confirm('纳尼？', {
btn: ['按钮一', '按钮二', '按钮三'] //可以无限个按钮
,
btn3: function(index, layero) {
//按钮【按钮三】的回调
}
}, function(index, layero) {
//按钮【按钮一】的回调
}, function(index) {
//按钮【按钮二】的回调
});

}

//多个确认按钮
function f3(){
layer.open({
content: 'test'
,btn: ['按钮一', '按钮二', '按钮三']
,yes: function(index, layero){
//按钮【按钮一】的回调
alert(1);
layer.close(index);
}
,btn2: function(index, layero){
//按钮【按钮二】的回调
alert(2);
//return false 开启该代码可禁止点击该按钮关闭
}
,btn3: function(index, layero){
//按钮【按钮三】的回调
alert(3);
//return false 开启该代码可禁止点击该按钮关闭
}
,cancel: function(){
//右上角关闭回调

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

//多个确认按钮
function f4(){
layer.open({
content: 'test'
,btn: ['确定', '取消']
,yes: function(index, layero){
//确定的回调
alert(1);
layer.close(index);
return 1;
}
,btn2: function(index, layero){
//取消的回调
alert(2);
return 2;
//return false 开启该代码可禁止点击该按钮关闭
}

,cancel: function(){
//右上角关闭回调
// return false //开启该代码可禁止点击该按钮关闭
}
});
}


</script>

</html>

llettod

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
Layui 弹窗 - layer.msg（提示框）

<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> &l...
复制链接

扫一扫