一個比較挫的寫法，是用閉包寫的，請參考下文：
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=)