1个回答
展开全部
将如下代码粘贴到一个html文件中 用IE打开就能查看效果，就是通过修改span的宽度实现进度条的效果 你可以定时去服务器读进度 然后更新span的宽度
<script language="javascript">
var currentProgress = 0;
var time;
function begin(){
if (currentProgress == 100) {
currentProgress = 0;
}
if (time){
clearTimeout(time);
}
time = window.setTimeout("draw()", 100);
}
function draw() {
currentProgress = currentProgress + 10;
if (currentProgress > 100){
currentProgress = 100;
}
document.getElementById("inner1").style.width = currentProgress + "%";
document.getElementById("inner1").style.visibility = "visible";
document.getElementById("testProgressText").innerText = (currentProgress + '%');
if (currentProgress == 100)
{
return;
}
window.setTimeout("draw()", 100);
}
</script>
<body>
<div id="testProgress" style="float:left;width:100px;height:12px;border:2px solid;">
<span id="inner1" style="width:0%;line-height:12px;visibility:hidden;background-color:green;height: 12px;">
</span>
</div>
<div id="testProgressText" style="width:50px;height:12px;float:left;">
</div>
<button onclick="begin()">Test Here</button>
</body>
<script language="javascript">
var currentProgress = 0;
var time;
function begin(){
if (currentProgress == 100) {
currentProgress = 0;
}
if (time){
clearTimeout(time);
}
time = window.setTimeout("draw()", 100);
}
function draw() {
currentProgress = currentProgress + 10;
if (currentProgress > 100){
currentProgress = 100;
}
document.getElementById("inner1").style.width = currentProgress + "%";
document.getElementById("inner1").style.visibility = "visible";
document.getElementById("testProgressText").innerText = (currentProgress + '%');
if (currentProgress == 100)
{
return;
}
window.setTimeout("draw()", 100);
}
</script>
<body>
<div id="testProgress" style="float:left;width:100px;height:12px;border:2px solid;">
<span id="inner1" style="width:0%;line-height:12px;visibility:hidden;background-color:green;height: 12px;">
</span>
</div>
<div id="testProgressText" style="width:50px;height:12px;float:left;">
</div>
<button onclick="begin()">Test Here</button>
</body>
本回答由网友推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
