巧用ajax請求服務器加載數據列表時提示loading的方法
更新時間:2017年04月17日 10:33:15 投稿:jingxian
下面小編就為大家?guī)硪黄捎胊jax請求服務器加載數據列表時提示loading的方法。小編覺得挺不錯的,現在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
我們利用weui.js中的weui.loading為效果,ajax的beforeSend與complete方法,做一個加載數據時會有幾秒的 loading...
要在頁面需要加載的JS文件:
<script src="../js/libs/weui.min.js"></script>
可以去weui的文檔中下載,這是它的demo: https://weui.io/weui.js/
這里主要講jQuery ajax的get,查詢數據時,它的結構為:
$.ajax({ type: 'get', url: url, data: data, dataType: 'json', contentType: 'apllication/json; charset=utf-8' , //數據加載前調用的方法 beforeSend() beforeSend: function(data){ //這里判斷,如果沒有加載數據,會顯示loading if(data.readyState == 0){ weui.loading('loading'); } }, //數據加載成功調用的方法 sucess() sucess: function(data){ //這里寫數據加載成功后,會執(zhí)行的代碼 }, //數據加載成功后調用的方法 complete() complete: function(data){ //這里判斷,數據加載成功之后,loading 隱藏 if(data.status == 200){ setTimeOut(function(){ weui.loading('loading').hide(); },500); } }, //數據加載錯誤后調用的方法 error() error: function(data){ weui.topTips('數據加載失??!'); } })
以上這篇巧用ajax請求服務器加載數據列表時提示loading的方法就是小編分享給大家的全部內容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
您可能感興趣的文章:
相關文章
Ajax 動態(tài)載入html頁面后不能執(zhí)行其中的js快速解決方法
這篇文章主要介紹了Ajax 動態(tài)載入html頁面后不能執(zhí)行其中的js快速解決方法,需要的朋友可以參考下2018-06-06HTTP狀態(tài)代碼及其定義解析 Ajax捕捉回調錯誤參考
當用戶試圖通過 HTTP 訪問一臺正在運行 Internet 信息服務 (IIS) 的服務器上的內容時,IIS 返回一個表示該請求的狀態(tài)的數字代碼。狀態(tài)代碼可以指明具體請求是否已成功,還可以揭示請求失敗的確切原因2013-11-11