ajax 下載顯示進度

時間 2019-12-26

標籤 ajax 下載顯示進度欄目 Ajax 简体版

原文原文鏈接

<!doctype html>javascript

<html class="no-js">html

<head>java

<title>ajax</title>ajax

ui

</head>

<body>

<div>

進度：<span id='progress'>0%</span><br/>

</div>

var http=new XMLHttpRequest(),//新建一個HTTP請求對象

progress=document.getElementById('progress');//顯示進度

function download(){

http.open('GET','./dowload.zip',true);

http.onreadystatechange=function(){

if(http.readyState===4){

progress.innerHTML='ok';

};

}

//監聽下載進度變化事件

http.addEventListener('progress',function(evt){

if(evt.lengthComputable){

var percent=parseInt((evt.loaded/evt.total)*100);//計算百分比

progress.innerHTML=percent+'%';

}

},false);

http.send();

}

</script>

</body>

</html>

chrome測試經過

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。