這次帶給大家Ajax實作載入進度條的步奏詳解,Ajax實作載入進度條的注意事項有哪些,以下就是實戰案例,一起來看一下。
#先說這個beforeSend, 在請求發送前執行例如可以判斷用戶有沒有登錄,如果沒有登入就停止請求並提示。
$.ajax({ url : 'my_action', dataType: 'script', beforeSend : function(xhr, opts){ if(1 == 1) //just an example { xhr.abort(); // 停止请求 } }, complete: function(){ console.log('DONE'); } });
$.ajax有一個參數是complete:function(){} 是在請求完成之後執行的,配合beforeSend可以用來展示進度條
例如:
$.ajax({ url : 'my_action', dataType: 'script', beforeSend : function(){ // 设置 进度条到20%慢慢变到50% }, complete: function(){ // 设置 进度条到80% } success:function(){ // 渲染页面 // 进度到100% } });
這個只是表面上的看到的進度條,顯示大概的進度,並不是真正的加載進度。
相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!
推薦閱讀:
#以上是Ajax實作載入進度條的步奏詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!