<!DOCTYPE html>
<html> <head>
<meta charset="gbk" />
<title> progress元素的使用</title>
</head>
<p id="pTip">开始下载</p>
<progress value="0" max="100" id="proDownFile"></progress>
<input type="button" value="下载" οnclick="Btn_Click();">
<script type="text/javascript">
var intValue=0;
var intTimer;
var objPro=document.getElementById('proDownFile');
var objTip=document.getElementById('pTip');
//定时事件
function Interval_handler(){
intValue++;
objPro.value=intValue;
if(intValue>=objPro.max){
clearInterval(intTimer);
objTip.innerHTML="下载完成";
}else{
objTip.innerHTML="正在下载"+intValue+"%";
}
}
function Btn_Click(){
intTimer=setInterval(Interval_handler,100);
}
</script>
</body></html>
progress加载进度条
最新推荐文章于 2024-07-12 15:47:36 发布