xhr 上传文件 带进度条 loading 实现方法
xhr 上传示例
//本地上传 let data = new FormData(); data.append('id',id); data.append('filename',fid); console.log('formData',data); let xhr = new XMLHttpRequest(); xhr.onreadystatechange = function(){ if(xhr.readyState == 4 && xhr.status==200){ if(xhr.responseText){ var res = JSON.parse(xhr.responseText); res.forEach(function(v,i){ window[fid+'_url'].push(v.src); window[fid+'_fname'].push(v.name); }); // console.log('newurl',window[fid+'_url']); resolve(window[fid+'_url']); }else{ resolve(window[fid+'_url']); } }else{ $('#loadDiv').hide(); } }; xhr.open('POST','./upfile'); xhr.upload.onprogress = (e) => { if (e.lengthComputable) { $('#loadDiv').show(); let percentComplete = e.loaded / e.total * 100; //这个地方可以处理进度条 console.log('上传进度',percentComplete); if(percentComplete == 100){ $('#loadDiv').hide(); } } } xhr.send(data)