js通过FormData对象 异步提交文件 实现文件上传（附带参数）

1 <h5>文件上传</h5><hr/> 2 <form method="POST" action="" name="form" enctype="multipart/form-data"> 3<input type="text" name="userid" value="${userid }"/>4<input type="text" name="companyid" value="${companyid }"/>5<input type="file" name="file"/>6<input type="submit" class="upload" value="上传"/> 7</form>

1 <script type="text/javascript"> 2 $(".upload").click(function(){ 3 //通过FormData对象 异步提交文件 返回提交结果 4 var img = document.form.file.files[0]; 5 var companyid = $("[name='companyid']").val(); 6 var userid = $("[name='userid']").val(); 7 var fm = new FormData(); 8 fm.append('file', img); 9 fm.append('userid', userid);10 fm.append('companyid', companyid);11 var url = saasurl+"/management/uploadFile";12 $.ajax({13 url:url,14 cache:false,15 type:"POST",16 data:fm,17 headers:{"X-usertoken":sessionStorage.getItem("token")},18 processData:false,19 contentType:false,20 complete:function(xhr){21 if(xhr.readyState==4&&xhr.status==200){22var result = xhr.responseText;23var json = JSON.parse(result);24var code =json.ret_code;25if(code=="000"){26 var url = json.fileUrl;27 var name = json.fileName;28 var innerHtml = "<a style='cursor: pointer;color: yellow;' target='_blank' href="+url+">&nbsp;点击查看&nbsp;</a>";29 $(".msg").html("上传成功（"+innerHtml+"）！");30 $(".alerttop").fadeToggle();31}else{32 $(".myadmin-alert").removeClass("alert-success").addClass("alert-warning");33 $(".msg").text(json.ret_msg);34 $(".alerttop").fadeToggle();35}3637 }else{38$(".myadmin-alert").removeClass("alert-success").addClass("alert-warning");39$(".msg").text("上传失败！");40 $(".alerttop").fadeToggle();41 }42 43 }44 })45 return false; //防止刷新页面46 });47</script>

如果觉得《js通过FormData对象 异步提交文件 实现文件上传（附带参数）》对你有帮助，请点赞、收藏，并留下你的观点哦！