<![CDATA[刘新修]]> http://pic1.liuxinxiu.com:80/index.php zh-cn http://pic1.liuxinxiu.com:80/Ajax_Loading/ <![CDATA[原JS/封装Ajax图片上传【加载进度条方法】]]> 刘新修 <admin@yourname.com> Wed, 28 Oct 2015 09:24:32 +0000 http://pic1.liuxinxiu.com:80/Ajax_Loading/
JavaScript代码
  1. /**** 原生JS封装Ajax图片上传【加载进度条方法】 ****/  
  2. ajax({   
  3.      //url:'/xdo/marketActivity/task/uploadImage.do',  
  4.      url:'/xdo/marketActivity/common/uploadImage.do',  
  5.      type:'POST',  
  6.      data:{guid:_guid,plat:_plat,file:upload.fileSrc,isMain:upload.isMain,isFinish:upload.finish},  
  7.      dataType:'json',  
  8.      timeout:9000,  
  9.      //xhr:xhrProvider,  
  10.      beforeSend:function(){  
  11.         var bodyDom=document.getElementsByTagName("body")[0];  
  12.         var loading=document.getElementById('loading');  
  13.         loading.setAttribute("usable","true");  
  14.         loading.style.display="block";  
  15.         loading.innerHTML='loading...';  
  16.      },  
  17.      uploading:function(data){  
  18.         console.log(data);  
  19.      },  
  20.      success:function(data){  
  21.         //console.log(data);  
  22.      },  
  23.      fail:function(data){  
  24.         //console.log(data);  
  25.      }  
  26. });  
  27. /**** jquery/Ajax图片上传【加载进度条方法】 ****/  
  28. function onprogress(evt){  
  29.     // display uploading progress infomation...  
  30.     alert(evt.loaded)  
  31.     console.log((evt.loaded/evt.total)*100);  
  32. };  
  33. var xhrProvider=function(){  
  34.     var xhr=$.ajaxSettings.xhr();  
  35.     //var xhr=new XMLHttpRequest();  
  36.     //var xhr=ajaxY.xhr;  
  37.     //alert(xhr.upload)  
  38.     if(onprogress&&xhr.upload){  
  39.         xhr.upload.addEventListener('progress', onprogress, false);  
  40.     }  
  41.     return xhr;  
  42. };  
  43. $.ajax({   
  44.      //url:'/xdo/marketActivity/task/uploadImage.do',  
  45.      url:'/xdo/marketActivity/common/uploadImage.do',  
  46.      type:'POST',  
  47.      data:{guid:_guid,plat:_plat,file:upload.fileSrc,isMain:upload.isMain,isFinish:upload.finish},  
  48.      dataType:'json',  
  49.      timeout:9000,  
  50.      xhr:xhrProvider,  
  51.      success:function(data){  
  52.         //console.log(result);        
  53.      },  
  54.      error:function(data){  
  55.         //console.log(data);  
  56.      }  
  57. });  
]]> http://pic1.liuxinxiu.com:80/Ajax_Loading/#blogcomment <![CDATA[[评论] 原JS/封装Ajax图片上传【加载进度条方法】]]> <user@domain.com> Thu, 01 Jan 1970 00:00:00 +0000 http://pic1.liuxinxiu.com:80/Ajax_Loading/#blogcomment