标签:code layui 按钮 rev hid ica 上传 open name
页面上一个按钮,点击弹出上传框,从按钮的方法代码开始写:处理未选择文件阻止上传;通过判断选择文件的数量,显示或隐藏上传按钮;
在js中定义:
1 function uploadFile(){ 2 3 layer.open({ 4 5 type:1, 6 7 title:‘上传文件‘, 8 9 area:[‘25%‘,‘400px‘], 10 11 content:‘<div class="layui-form-item" style="margin-top:40px;"> 12 13 <div class="layui-input-block"> 14 15 <input class="layui-btn" type="button" id="chooseFIle" value="选择文件"> 16 17 <span></span> 18 19 </div> 20 21 </div> 22 23 <div class="layui-form-item" style="margin-top:40px;"> 24 25 <div class="layui-input-block"> 26 27 <input class="layui-btn" type="button" id="uploadbtn" value="上传"> 28 29 <span></span> 30 31 </div> 32 33 </div>‘, 34 35 btn:[‘关闭‘], 36 37 btn1:function(idx,ele){ 38 39 layer.closeAll(); 40 41 } 42 43 }) 44 45 createUpload(); 46 47 } 48 49 50 51 var files ; 52 53 function createUpload(){ 54 55 $("#uploadbtn").hide(); 56 57 $("#chooseFile").next().next("span").text(""); 58 59 layui.use([‘upload‘],function(){ 60 61 var uploadInst = upload.render({ 62 63 elem:‘#chooseFile‘, 64 65 url:‘ ‘, 66 67 accept:‘file‘, 68 69 auto:false, 70 71 multiple:true, 72 73 acceptMime:‘application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet‘, 74 75 exts:‘xls|xlsx‘, 76 77 size:1024000, 78 79 number:5, 80 81 bindAction:‘#uploadbtn‘, 82 83 choose:function(obj){ 84 85 files = this.files = boj.pushFile(); 86 87 if(Object.keys(files).length>0){ $("#uploadbtn").show(); } 88 89 obj.preview(function(index,file,result){ 90 91 $("#chooseFile").siblings("span").append("<div title=‘"+index+"‘>"+file.name+" <span onclick=‘deletefile(\""+index+"\")‘>×</span></div>") 92 93 if(index>0) {$("#uploadbtn").show() ;} 94 95 }) 96 97 }, 98 99 allDone:function(obj){ 100 101 if(obj.successful){ 102 103 layer.msg(obj.total+"个文件上传成功!"); 104 105 } 106 107 }, 108 109 error:function(){ 110 111 layer.alert("上传成功!"); 112 113 } 114 115 }) 116 117 } 118 119 } 120 121 function deletefile(index){ 122 123 delete files[index]; 124 125 $("#chooseFile").siblings("span").find("div[title="+index+"]").remove(); 126 127 if(!Object.keys(files).length>0){ 128 129 $("#uploadbtn").hide(); 130 131 } 132 133 134 135 }
标签:code layui 按钮 rev hid ica 上传 open name
原文地址:https://www.cnblogs.com/mo3408/p/12181466.html