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

95次阅读

共计 1858 个字符,预计需要花费 5 分钟才能阅读完成。

网上随便搜了一下,找到一些方法,比如:

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

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

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

JavaScript

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
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();
                        }
                    });
                }
            });

 

正文完
 0