layui-upload上传组件拦截

    技术2022-07-17  108

    layui.upload判断并阻止文件上传 在upload.js,搜索y=function,注释掉该function大括号内的语句并替换成:

    if ("choose" !== i && !l.auto || (l.choose && l.choose(g), "choose" !== i)) return (l.before && l.before(g))===false?'':o.ie ? o.ie > 9 ? u() : c() : void u() <div id="files"> <div class="layui-upload"> <button type="button" class="layui-btn layui-btn-normal" id="testList"> 选择文件 </button> <div class="layui-upload-list"> <table class="layui-table"> <thead> <tr> <th>文件名</th> <th>大小</th> <th>状态</th> <th>操作</th> </tr> </thead> <tbody id="demoList"></tbody> </table> </div> </div> </div> layui.use('upload',function(){ var upload = layui.upload var demoListView = $('#demoList') ,uploadListIns = upload.render({ elem: '#testList' ,url: '/demand/file' ,accept: 'file' ,exts: 'docx|pdf' //只允许上docx/pdf ,multiple: true //多文件上传 ,auto: false ,bindAction: '#testListAction' ,choose: function(obj){ var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列 //预读本地文件,如果是多文件,则会遍历 obj.preview(function(index, file, result){ var tr = $(['<tr id="upload-'+ index +'">' ,'<td>'+ file.name +'</td>' ,'<td>'+ (file.size/1024).toFixed(1) +'kb</td>' ,'<td>等待上传</td>' ,'<td>' // ,'<button class="layui-btn layui-btn-xs demo-reload layui-hide">重传</button>' ,'<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>' ,'</td>' ,'</tr>'].join('')); //单个重传 // tr.find('.demo-reload').on('click', function(){ // obj.upload(index, file); // }); //删除 tr.find('.demo-delete').on('click', function(){ delete files[index]; //删除对应的文件 tr.remove(); uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值,以免删除后出现同名文件不可选 }); demoListView.append(tr); }); } ,before:function(obj){ // layer.load() var wikiurl = $('input[name="wiki_url"]').val() this.data = {'wiUrl':wikiurl} if(wikiurl){ return true }else { layer.msg("请输入父页面链接"); //值为空时,提醒用户输入对应的值 return false; //通过wikiurl判断值是否为空,如果为空,则返回false,拦截上传文件 //这里需要重写load.js源文件,否则return false无效 //在upload.js,搜索y=function,注释掉该function大括号内的语句并替换成: //if ("choose" !== i && !l.auto || (l.choose && l.choose(g), "choose" !== i)) return (l.before && l.before(g))===false?'':o.ie ? o.ie > 9 ? u() : c() : void u() } } ,done: function(res, index, upload){ console.log('res:',res) var tr = demoListView.find('tr#upload-'+ index) ,tds = tr.children(); if(res.res === 'success'){ //上传成功 tds.eq(2).html('<span style="color: #5FB878;">写入成功</span>'); tds.eq(3).html(''); //清空操作 layer.msg("Wiki写入成功") var fileurl = res['url'] var htmlid = res['htmlid'] $('#showurl').append("<span style='color: red'>Wiki目标地址:</span><a id='"+htmlid+"' href='"+fileurl+"' target='_blank'>"+fileurl+"</a><button style='margin-left: 20px' class='btn layui-btn layui-btn-radius layui-btn-xs' data-clipboard-target='#"+htmlid+"'>复制链接</button><br/>") var clipboard = new ClipboardJS('.btn'); //剪贴板 clipboard.on('success', function(e) { // console.log(e); }); clipboard.on('error', function(e) { // console.log(e); }); return delete this.files[index] //删除文件队列已经上传成功的文件 }else if(res.res === 400){ tds.eq(2).html('<span style="color: #5FB878;">页面已存在</span>') tds.eq(3).html(''); //清空操作 layer.msg("wiki页面已存在") return delete this.files[index] }else if(res.res === 401){ layer.msg("无法获取父页面信息") return delete this.files[index] }else if(res.res === 404){ layer.msg("父页面未找到") return delete this.files[index] }else if(res.res === 500){ tds.eq(2).html('<span style="color: #5FB878;">文件类型错误</span>') tds.eq(3).html(''); //清空操作 layer.msg("文件类型不符合要求") return delete this.files[index] }else if(res.res === 501){ tds.eq(2).html('<span style="color: #FF5722;">文件类型错误</span>') tds.eq(3).html(''); //清空操作 layer.msg("PDF文件读取内容为空") return delete this.files[index] } this.error(index, upload); } ,error: function(index, upload){ var tr = demoListView.find('tr#upload-'+ index) ,tds = tr.children(); tds.eq(2).html('<span style="color: #FF5722;">写入失败</span>'); // tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传 } }); })
    Processed: 0.009, SQL: 9