一个比较挫的写法，是用闭包写的，请参考下文：
https://blog.csdn.net/zhi_ai_yaya/article/details/86225400
本文是比较正确的一种使用方式：
1.主页index.html ——请自行引用jquery和layui。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layui</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel="stylesheet" href="/layui-v2.4.5/css/layui.css" media="all">
<!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
<style type="text/css">
/* 自定义样式 */
/* .layui-button-block {
text-align: center;
}
.layui-form-button {
position: absolute;
bottom: 0px;
width: 100%;
margin: 0px auto;
padding-top: 10px;
padding-bottom: 10px;
background-color: #e6e6e6;
}
body .layui-layer-btn {
text-align: center;
} */
</style>
</head>
<body>
<div class="layui-low" style="margin:20px;">
<button id="btn-test" class="layui-btn layui-btn-primary">测试按钮</button>
</div>
<script src="/layui-v2.4.5/layui.all.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script src="/jquery/jquery.min.js" charset="utf-8"></script>
<script>
layui.use('table', function () {
$("#btn-test").on("click", function () {
$.get('/test.html', 'id=1', function (str) {
layer.open({
type: 1,
title: '页面窗口',
id: 'test',
shadeClose: false,
shade: [0.3, '#393D49'],
maxmin: true, //开启最大化最小化按钮
area: ['893px', '600px'],
content: str, //注意，如果str是object，那么需要字符拼接。
btnAlign: 'c',
end: function () {
alert('count=' + count + ' result=' + result);
//return false 开启该代码可禁止点击该按钮关闭
}
});
});
});
});
</script>
</body>
</html>
2.弹窗页面test.html
<form class="layui-form" action="" lay-filter="example">
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">验证手机</label>
<div class="layui-input-inline">
<input type="tel" name="phone" lay-verify="required|phone" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
</div>
</div>
</form>
<script>
//全局变量，用于返回给调用该页面的窗口
var count = 0;
var result = '状态：未提交';
layui.use(['form'], function () {
var form = layui.form, layer = layui.layer;
form.render();
//监听提交
form.on('submit(demo1)', function (data) {
// layer.alert(JSON.stringify(data.field), {
// title: '最终的提交信息'
// })
// return false;
count++;
$.ajax({
url: '/demo.json?phone=' + data.field.phone,
type: 'get',
async: false,//必须是同步提交的
success: function (ret) {
//console.log(JSON.stringify(ret));
if (count > 1) { //模拟成功的返回值，具体请使用ret参数
layer.alert(JSON.stringify(ret), {
title: '大于3次表示提交成功，要关闭窗口'
// ,yes: function(index, layero){
// layer.close(index); //此时你只需要把获得的index，轻轻地赋予layer.close即可
// }
});
result = '提交成功';
layer.closeAll('page'); //关闭所有页面层：此处会有一个坑，如果是多个页面层弹窗，是否全部被干掉了？？
} else {
layer.alert(JSON.stringify(ret), {
title: '小于3次表示提交失败，不能关闭窗口'
});
result = '提交失败';
}
},
error: function () {
result = '提交失败';;
}
});
return false;
});
//表单初始赋值
form.val('example', {
"phone": "15720337502"
})
});
</script>
3.数据接口 demo.json
{
"code": 0
,"msg": ""
,"count": 3000000
,"data": [{
"id": "10001"
,"username": "杜甫"
,"email": "[email protected]"
,"sex": "男"
}]
}
总结：
弹窗通过ajax提交成功之后，会弹出一个 提示窗口（提交成功），但是接着要执行下面的这句代码才能关闭 测试窗口而保留提示窗口。这个问题比较恶心恶心恶心恶心恶心。。。。
如果是弹窗再弹窗再弹窗，closeAll岂不是得gg？
layer.closeAll('page'); //关闭所有页面层：此处会有一个坑，如果是多个页面层弹窗，是否全部被干掉了？？
如果有更好的方法麻烦在评论中回复下，非常感谢！！！
总结下写法：
//监听提交
form.on('submit(demo1)', function (data) {
// layer.alert(JSON.stringify(data.field), {
// title: '最终的提交信息'
// })
// return false;
count++;
$.ajax({
url: '/demo.json?phone=' + data.field.phone,
type: 'get',
async: false,//必须是同步提交的
success: function (ret) {
//console.log(JSON.stringify(ret));
if (count > 1) { //模拟成功的返回值，具体请使用ret参数
result = '提交成功';
///写法1-start-直接关闭，OK
//layer.close(index);
///写法1-end
//写法2-start-关闭所有层，OK
// layer.alert(JSON.stringify(ret), {
// title: '大于3次表示提交成功，关闭窗口'
// });
//layer.closeAll('page'); //关闭所有页面层：此处会有一个坑，如果是多个页面层弹窗，是否全部被干掉了？？
//写法2-end
//写法3-start-直接关闭最新弹出的层。要减1
//layer.close(layer.index -1); //如果你想关闭最新弹出的层，直接获取layer.index即可。//它获取的始终是最新弹出的某个层，值是由layer内部动态递增计算的
//写法3-end
//写法4-start-直接关闭后，弹出3秒自动提示框
// layer.close(layer.index - 1);
// layer.msg('同上', {
// icon: 1,
// time: 3000 //3秒关闭（如果不配置，默认是3秒）
// }, function(){
// //do something
// }
// );
//写法4-end
//写法5-start，OK
// layer.close(layer.index - 1);
// layer.alert(JSON.stringify(ret), {
// title: '大于3次表示提交成功，关闭窗口'
// });
//写法5-end
//写法6-start,OK。对比写法4和写法5，说明这个layer.index索引计算是有并发问题的！！
layer.alert(JSON.stringify(ret), {
title: '大于3次表示提交成功，关闭窗口'
});
layer.close(layer.index - 2); //必须是减2
//写法6-end
} else {
layer.alert(JSON.stringify(ret), {
title: '小于3次表示提交失败，不能关闭窗口'
});
result = '提交失败';
}
},
error: function () {
result = '提交失败';;
}
});
return false;
});
![websocket 实战——好友聊天JS websocket 实战——好友聊天[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)