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){
22                         var result = xhr.responseText;
23                         var json = JSON.parse(result);
24                         var code =json.ret_code;
25                         if(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                         }
36                         
37                     }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>

 

转载于:https://www.cnblogs.com/by-candy/p/8884550.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值