HTML5文件加载进度管理

时间:2024-08-04 10:03:32
/**
* 文件加载进度管理
*/
DownloadUtils = function(options){
options = options || {};
this.init(options);
}; DownloadUtils.prototype = {
init:function(options){
var _this = this;
this.url = options.url;
var xhr = new XMLHttpRequest();
xhr.open("get", this.url, true);
xhr.onload = function() {
if (xhr.status == 200) {
//TODO
}
}
xhr.onloadend = function(){
if(typeof options.onComplete == "function"){
options.onComplete();
}
}
xhr.onprogress = function(event){
if(event.lengthComputable){
if(typeof options.onProgress == "function"){
options.onProgress(event.loaded, event.total);
}
}
else{
if(typeof options.onProgressError == "function"){
options.onProgressError();
}
}
}
xhr.send();
}
};
new DownloadUtils({
url:images[i],
onProgress:function(loaded, total){
var percentage = (loaded * 100/ total) + '%';
console.log(percentage);
},
onProgressError:function(){
console.log("onProgressError");
},
onComplete:function(){
console.log("onComplete");
}
});