1. 程式人生 > >layui彈窗只有在ajax請求結束時之後才關閉,async阻塞

layui彈窗只有在ajax請求結束時之後才關閉,async阻塞

實踐中遇到的坑,在用layui彈窗時,彈窗內容是動態渲染的,在渲染完畢後點擊確定請求ajax,但是我想要在點選確定後出現layui的loading,但是總是ajax請求結束之後才載入loading,原因是我在ajax中使用了async:false;去掉即可

layer.open({
    type: 1,
    title: ['請選擇要顯示的列', 'font-size:1.1rem;','background:#fff !important;','color:black !important;'],
    area: ['500px', '300px'], //寬高
    content
: content, btn: ['確認', '取消'], btn1: function (index, layero) { var shezhilieindex = layer.load(1, { shade: [0.3, '#E0E0E0'] // }); layer.close(index); //選中的列的id idList = []; var text = $("[class='layui-unselect layui-form-checkbox layui-form-checked']"
) $.each(text,function (i,obj) { var content = $($(obj).parent().children()[0]).val(); idList.push(content); }); console.log(idList); $.ajax({ type: "post", url: window.webUrlApi.Load.getListValue,//請求的路徑 dataType: 'json'
, contentType: "application/json;charset=UTF-8", data: JSON.stringify({ "page": 1, "pageSize": 5, "fakeId": sessionStorage.getItem("cid"), "idlist": idList, "bomid": sessionStorage.getItem("bomid"), "code": sessionStorage.getItem("code"), "cid": sessionStorage.getItem("bid") }), async: true, success: function (data) { //請求成功後處理函式。 layer.close(shezhilieindex); console.log(data); if(data.ok ){ columChecked = {}; MaterialList(shezhiliei,data.data); console.log("設定列後的資料"); console.log(data.data); }else { //重置 //MaterialList(infoIndex); layer.alert('獲取資料失敗'); } }, error: function () {//請求失敗處理函式 console.log('ajaxError! 請求失敗'); } }); }, btn2: function (index, layero) { layer.close(index); }, cancel:function (index, layero) { layer.close(index); } });