使用$.ajax可以輕松地向服務器發起HTTP請求,獲取JSON格式的數據。在進行請求時,我們可以通過beforeSend選項設置請求前的操作函數。為了實現請求進度的監聽,需要在代碼中設置xhr.upload.onprogress函數。
$.ajax({ type: "GET", url: "example.com/json", dataType: "json", beforeSend: function(xhr){ xhr.upload.onprogress = function(e){ if(e.lengthComputable){ var percent = (e.loaded/e.total)*100; console.log(percent + "%"); } }; }, success: function(data){ console.log(data); }, error: function(xhr, status, error){ console.log(status + ": " + error); } });
上面的代碼表示向URL為example.com/json的服務器發起GET請求,獲取JSON格式的數據。在請求前,設置xhr.upload.onprogress函數監聽請求進度。如果請求為可計算狀態,則計算并輸出百分比。請求成功后,調用success函數處理數據。如果發生錯誤,則調用error函數輸出錯誤信息。
需要注意的是,請求進度的監聽只能在FormData和XMLHttpRequest Level 2類型的數據傳輸方法中應用。在IE 9及以下版本瀏覽器中,不支持xhr.upload.onprogress函數的使用。
上一篇用css只做一個矩形
下一篇用css取消列表中的前綴