用javascript写的进度条,怎么获取进度条的值,按百分比显示出来

 我来答
匿名用户
2017-08-22
展开全部
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>RunJS</title>
<style>
#progress{
border:1px solid black;
width:500px;
height:20px; 
text-align:center;
}
#progress>div{
width:0px;
height:20px;
position:absolute;
background-color:yellow;
}
#progress>span{
color:red;
position:absolute;
}
</style>
<script type="text/javascript">
onload = function(){
var div = progress.querySelector("div");
var span = progress.querySelector("span");
var pw = parseFloat(progress.style.width) || parseFloat(getComputedStyle(progress).width) || progress.offsetWidth;
var interval = setInterval(function(){
var w = parseFloat(div.style.width) || parseFloat(getComputedStyle(div).width) || div.offsetWidth;
w+=10;
if(w>=pw){
w = pw;
clearInterval(interval);
}
div.style.width = w + "px";
span.innerHTML = w*100/pw + "%";
},60);
};
</script>
</head>
<body> 
 <div id="progress">
 <div>
 
 </div>
 <span></span>
</div>
</body>
</html>
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式