layui弹窗只有在ajax请求结束时之后才关闭,async阻塞

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/yuanlijiefengjuan/article/details/79741146

实践中遇到的坑,在用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);
    }
});

猜你喜欢

转载自blog.csdn.net/yuanlijiefengjuan/article/details/79741146
今日推荐