原生ajax无刷新上传图片

一、表单上传文件必须加上enctype="multipart/form-data",(以下是上传文件的表单)

<form class="form-horizontal formTable mb10" id="compLogoFile" method="post" enctype="multipart/form-data" role="form">
            
    <input name="file" id="compLogo" @change="upCompLogo()" class="fileBtn" type="file"/>
    <span>支持JPG、PNG、BMP格式文件,并不大于5MB</span>
                
</form>

二、javascript代码

var formData = new FormData($( "#compLogoFile" )[0]);
                            console.log(formData);    
                             $.ajax({    
                                  url: req.baseUrl +"/ftp/fileUpload/compLogo",  
                                  type: 'POST',    
                                  data: formData,    
                                  async: false,    
                                  cache: false,    
                                  contentType: false,    
                                  processData: false,    
                                  success: function (data) {
                                    console.log(data);
                                        _this.compMes.logo = data.data;
                                      document.getElementById("compLogo").src= data.data;/*这是预览图片用的,自己在文件上传表单外添加*/   
                  },
                 error:
function (data) { alert(data); } });
原文地址:https://www.cnblogs.com/vsmart/p/8038495.html