varxhronprogress=function(fun) {xhronprogress.onprogress= fun;//Binding Monitoring //using closures to implement listener bindings return function() { //get XMLHttpRequest objects by $.AJAXSETTINGS.XHR (); varXHR =$.ajaxsettings.xhr (); //determine if the listener function is a function if(typeofXhronprogress.onprogress!== ' function ') returnXHR; //If there is a listener function and the XHR object supports binding, the listener function is bound if(Xhronprogress.onprogress &&xhr.upload) {xhr.upload.onprogress=xhronprogress.onprogress; } returnXHR; } } //Fast File Upload functionNewfileupload (_this) {varFD =NewFormData (); Fd.append ("Paragram", 12345);//parameter values for the uploaded parameters k-v key-value pairsFd.append ("Upfile", $ ("#upfile"). Get (0). Files[0]);//file uploadedAjaxre =$.ajax ({URL:"${ctx}/platform/system/sysfile/fileupload.ht", type:"POST", ProcessData:false, ContentType:false, DATA:FD, success:function(data) {$ ("#loading_upload"). Hide (20); varFileid=json.parse (data). FileId; varFilename=json.parse (data). FileName; $("#fileList_upload"). HTML ($ ("#fileList_upload"). HTML () + ' <div style= ' font-size:15px;height:28px;line-height : 28px "><span fileid=" ' +fileid+ ' "name=" Attach "file=" ' +fileid+ ', ' +filename+ ' "res=" OA "filename=" ' +filename+ ' "> ' +filename+ ' </span> </div>") varobj={}; Obj.id=fileId Obj.name=fileName Uploadarr.push (obj); $("#filelist"). HTML (json.stringify (Uploadarr)); $("#upfile"). Val ("")}, Xhr:xhronprogress (function(e) {varPercent=e.loaded/e.total * 100;//Calculate Percentage$ ("#progess"). HTML (percent.tofixed (2)); }), Beforesend:function(){ $("#loading_upload"). Show (20); }, }) } functioncanceled_upload () {Ajaxre.abort () $ ("#upfile"). Val ("") $("#loading_upload"). Hide (20); }
jquery Get upload progress and cancel upload operation