<div class="col-md-1 col-md-gg"> <div class="form-group"> <!--<button id="sysDocUploadBtn" class="layui-btn" type="button" οnclick="$('#annex_name').click()" style="display: inline-block;"><i class="layui-icon"></i>上传附件</button><input type="file" id="annex_name" name="annex_name" style="display:none;" οnclick="addAnnex()">--> <button type="button" class="layui-btn" id="test1" style="margin-right: 10px"> <i class="layui-icon"></i>上传附件 </button> </div> </div> <input type="hidden" id="file_url" name="file_url" />
<table class="layui-table "> <thead> <tr> <th>附件名称</th> <th>附件用途</th> <th>操作</th> </tr> </thead> <tbody id="annexTbody" border="1px" width="100%" align="center"> </tbody> </table>
================================================================================================
<!-- 多文件上传功能 start --> <script> var uploadList = []; var uploadIndexList = []; layui.use([ 'layer','upload'], function(){ var layer = layui.layer; var upload = layui.upload; //得到 upload 对象 upload.render({ elem: '#test1' ,url: '../file/fileUpload' ,method: 'post' ,done: function(res, index, upload){ //上传后的回调 var uploadObject = new Object(); if(res.msg=='1'){ layer.msg("上传成功"); //生成上传成功后的文件信息tr addUpoloadTr(getUUID(),res.file_name,res.file_url,$('#annex_class option:selected').val(),$('#annex_class option:selected').text()); }else{ layer.msg("上传失败"); } } ,accept: 'file' //允许上传的文件类型 }) }); function addUpoloadTr(id,file_name,file_url,annex_class,annex_class_name){ var uploadObject = new Object(); uploadObject['annexId'] = id; uploadObject['annexName'] = file_name; uploadObject['fileUrl'] = file_url; uploadObject['annexClass'] = annex_class; uploadList.push(uploadObject); uploadIndexList.push(id); var tablestr = ""; tablestr += "<tr id=\"tr_annex_"+id+"\">"; tablestr += "<input type=\"hidden\" value="+id+" name=\"annex_id\"/>"; tablestr += "<td><a href='" + file_url + "' style='text-decoration:underline;color:#007DDB' target='_blank'>" + file_name + "</a></td>"; tablestr += "<td style=\"text-align: center; vertical-align: middle; width: 100px; \">"+ annex_class_name +"</td>"; tablestr += "<td><a class=\"layui-btn layui-btn-mini layui-btn-danger\" οnclick=\"delUploadTr('tr_annex_"+ id +"')\">"; tablestr += "<i class='iconfont icon-shenpi'>删除</i></a></td>"; tablestr += "</tr>"; $("#annexTbody").append(tablestr); } function delUploadTr(id){ uploadList.splice(uploadIndexList.indexOf(id.replace("tr_annex_",""),0),1); $("#"+id).remove(); } /** * 获取系统随机UUID * @returns {string} UUID */ function getUUID(){ var UUID = ""; $.ajax({ url: contextPath + "/getUUID", type: "post", async: false, datatype: "text", success: function (res) { UUID = res; }, error: function () { alert('系统出现异常'); } }); return UUID; } </script> <!-- 多文件上传功能 end -->