【Layui】上传文件

Dear 丶 2022-04-22 09:32 285阅读 0赞

> [《图片/文件上传 - layui.upload》][- layui.upload]

最近在做的一个功能里，需要在某些条件成立的情况下，才允许上传文件。

方法一：设置不自动上传，将上传事件绑定到另一个按钮，选择完文件后可以根据条件让上传按钮隐藏和显示

方法二：设置自动上传，这时就需要使用before方法或choose方法来判断条件，但是因为upload.js中本来不提供阻止上传的方式，所以得修改下upload.js的源码

找到以下代码：

return"choose"===t?l.choose&&l.choose(g):(l.before&&l.before(g),a.ie?a.ie>9?u():c():void u())

将其修改为：

return"choose"===t?l.choose&&l.choose(g):((l.before&&l.before(g))===false?'':a.ie?a.ie>9?u():c():void u())

这样一来，在before方法里`return false`就能阻止文件上传，而`return true`或没有返回值则允许上传。

--------------------

# 动态传参 #

upload.render({
        elem: '.importSectionBtn',
        url: '/ocOperatorNew/courseSection/doImport.do',
        method : "POST",
        accept: 'file',
        exts: 'xls|xlsx',
        data: {},	// courseId:$(".courseId").val();	
                    // 由于courseId并没有在加载页面时赋值，而是在当前页面操作后动态赋值，
                    // 而这里是加载页面时就会渲染，所以会导致取到的courseId为空
        before: function(obj){
            var courseId = $(".courseId").val();
            if(courseId == ''){
                layer.msg("请保存课程信息");
                return false;
            }
            this.data.courseId = courseId;	// 方法：在函数里手动赋值
        },
        done: function(res){
            layer.msg(res.msg);
            // 刷新本页面
            location.reload();
        }
    });

[- layui.upload]: https://www.layui.com/doc/modules/upload.html