ajax圖片載入,complete

標籤：style   blog   http   color   io   os   java   ar   div   

為了給使用者更好的體驗， 前輩們開發了ajax ， 

那麼如何用好這個ajax  給使用者最佳的體驗呢 ，  

好吧， 步入正題 ， 這節文章就是解決在ajax提交後 如何給使用者一個好的反饋，假如使用者進行操作 ， 等半天一點反應也沒有， 其實我們程式已經在執行了  。 那樣就會給人不好的一種感覺 ， 如果我們給他一點反饋效果就不一樣了， 明顯要好很多。 如 ！  

那麼這麼一張圖 ， 在ajax 運行是時候是如果載入進去的呢 ？  當然方法有很多種， 我還是貼上代碼吧 。  

ajaxLoad.textLoad = function(){ // 簡訊$(‘.waiting‘).show();  //這裡就是我提前準備好的一張gif載入圖片，初始化display設為none ， 當我ajax一開始啟動並執行時候我就讓這張圖顯示出來， 就有了我們上面的 var id = $(‘.grouplist li.active‘).attr(‘id‘);var content= $("#content").val();$.ajax({type : ‘post‘,url : ‘groups_data.do‘,dataType : ‘JSON‘,
　　　　　　　　　 timeout : 5000,data : {"type":"sendtext","group_id":id,"content":content},success : function(data){$(‘.waiting‘).hide();data = JSON.parse(data[‘result‘][‘data‘]);if(data[‘errcode‘] == 45009){   $.Confirm({html:"您本月群發訊息已達到上限！",buttons:{   "確定": function(){   return;   }   }});}else if(data[‘errcode‘] == 1){   $.Confirm({html:"發達失敗！",buttons:{   "確定": function(){   return;   }   }});}else if(data[‘errcode‘] == 1){   $.Confirm({html:"發達成功！",buttons:{   "確定": function(){   return;   }   }});   loadTextMaterialListL();}},complete : function(xhr,status){ // 在這裡我沒有用到error 回調 ，為什麼呢 ？  因為我們用到了complete ， 請求完成後回呼函數 (請求成功或失敗之後均調用)。$(‘.waiting‘).hide(); // 當ajax進入到complete回調的時候  , 我們就把剛才加顯示的那張載入圖片hide就行了 ，  if(status == ‘timeout‘){  //如果請求等於我們設定的逾時時間， 那麼執行下面的代碼 !   $.Confirm({html:"請求逾時，請稍後重試！" + status ,buttons:{   "確定": function(){   return;   }   }});}else if( status == ‘error‘){   $.Confirm({html:"請求出錯！" + status ,buttons:{   "確定": function(){   return;   }   }});}}})};

嗯 ， 其實就是這麼簡單 。 還等什麼，親自去試試吧。  

ajax圖片載入,complete