$.ajax({
type: "post",
url: uploadUrl,
data: formData,
processData: false,
contentType: false,
xhr : function() { //獲取ajaxSettings中的xhr物件,為它的upload屬性系結progress事件的處理函式
myXhr = $.ajaxSettings.xhr();
if (myXhr.upload) { //檢查upload屬性是否存在
//系結progress事件的回呼函式
myXhr.upload.addEventListener(
'progress',
progressHandlingFunction,
false);
}
return myXhr; //xhr物件回傳給jQuery使用
},
beforeSend: function() {
ot = new Date().getTime(); //設定上傳開始時間
oloaded = 0;//設定上傳開始時,以上傳的檔案大小為0
console.log("開始上傳")
},
success: function (data) {
console.log("上傳成功")
},
error: function (e) {
console.log("上傳失敗")
}
});
function progressHandlingFunction(evt) {
var nt = new Date().getTime();//獲取當前時間
var pertime = (nt-ot)/1000; //計算出上次呼叫該方法時到現在的時間差,單位為s
ot = new Date().getTime(); //重新賦值時間,用于下次計算
var perload = evt.loaded - oloaded; //計算該分段上傳的檔案大小,單位b
oloaded = evt.loaded;//重新賦值已上傳檔案大小,用以下次計算
//上傳速度計算
var speed = perload/pertime;//單位b/s
var bspeed = speed;
var units = 'b/s';//單位名稱
if(speed/1024>1){
speed = speed/1024;
units = 'k/s';
}
if(speed/1024>1){
speed = speed/1024;
units = 'M/s';
}
speed = speed.toFixed(1);
//剩余時間
var resttime = ((evt.total-evt.loaded)/bspeed).toFixed(1);
var percent = evt.loaded / evt.total * 100;
console.log('當前速度:'+speed+units+',剩余時間:'+resttime+'s,當前進度:'+percent.toFixed(2)+"%")
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/918.html
標籤:jQuery
上一篇:無聊試著寫個商品放大鏡功能
