layui上传文件时如何加loading效果

layui上传文件时如何加loading效果

//文件上传
    layui.use('upload', function () {
    
    
        //执行实例
        var uploadInst = upload.render({
    
    
            elem: '#iconUpload',  //绑定元素
            accept: 'file',
            url: 'https://it.xxxx.cn:xxxx/file/upload',  //上传接口
            before: function () {
    
    
            //开始加载效果
                layui.use('layer', function () {
    
    
                    layui.layer.load();
                    //console.log(Lodingindex) opacity
                    $(".layui-layer-shade").css('background', '#000000')
                    $(".layui-layer-shade").css('opacity', '0.2')
                    $(".layui-layer-shade").click(function (event) {
    
    
                        event.stopPropagation();
                    })
                })
            },
            done: function (res) {
    
    
                if (res[0] !== undefined || res[0] != null || res[0] != "") {
    
    
                    let fileLocation = "https://it.jisu8.cn:9999/dfile/" + res[0].sname;
                    $("#download").attr('placeholder', fileLocation);
                    $("#download").val(fileLocation);
                    layer.msg('上传成功');
                }
                //上传成功结束加载效果
                layui.use('layer', function () {
    
    
                    layui.layer.closeAll();
                    setTimeout(function () {
    
    
                        layui.layer.closeAll();
                    }, 2000);
                });
                form.render();
            }
            , error: function () {
    
    
                alert("文件上传失败");
            }
        });
    });

Guess you like

Origin blog.csdn.net/nyasm/article/details/120493155