Layui上传文件添加一个加载层动画

网上随便搜了一下，找到一些方法，比如：

https://blog.csdn.net/cainiao0589/article/details/100099567

https://blog.csdn.net/weixin_39218464/article/details/106663107

而我用到的是实例化的upload，通过layui内置的方法完成上传，所以上面这些方法，或多或少都不太对。

解决办法

找到Layui文档，上传部分：https://www.layui.site/doc/modules/upload.html

找到文件上传前的回调，这才是我们需要的。

完整代码分享如下，结合实际情况修改使用即可。

var uploadInst = upload.render({
                elem: '#upload-change',
                url: "/index/tools/dataInputApi" + '/year/' + year + '/month/' + month,
                accept: 'file', //运行上传所有文件
                exts: 'xls|xlsx|wps', //只允许上传excel文件
                auto: false
                    //,multiple: true
                    ,
                before: function(obj){ //obj参数包含的信息，跟 choose回调完全一致。
                    layer.load(); //上传loading
                },
                bindAction: '#test-upload-change-action',
                done: function (res) {
                    layer.closeAll('loading'); //关闭loading
                    layer.msg(res.msg, {
                        time: 2000,
                        end: function () {
                            console.log('updated');
                            console.log('close');
                            parent.layer.close(index);
                            parent.location.reload();
                        }
                    });
                }
            });

var uploadInst = upload.render({

elem: '#upload-change',

url: "/index/tools/dataInputApi" + '/year/' + year + '/month/' + month,

accept: 'file', //运行上传所有文件

exts: 'xls|xlsx|wps', //只允许上传excel文件

auto: false

//,multiple: true

before: function(obj){ //obj参数包含的信息，跟 choose回调完全一致。

layer.load(); //上传loading

bindAction: '#test-upload-change-action',

done: function (res) {

layer.closeAll('loading'); //关闭loading

layer.msg(res.msg, {

time: 2000,

end: function () {

console.log('updated');

console.log('close');

parent.layer.close(index);

parent.location.reload();

}

});

}

});

原创文章，作者：蓝洛水深，如若转载，请注明出处：https://blog.lanluo.cn/10470

Layui上传文件添加一个加载层动画

解决办法

相关推荐

发表回复