如何在JavaScript中为我的进度条设置百分比？

我不知道Javascript中的任何内容（我已经复制了进度条的代码，但不显示百分比）。我只需要在我的进度条（文本如1％，2％，3％...）内显示实际％的文本值。如何在JavaScript中为我的进度条设置百分比？

现有的代码，我有如下（我不在乎的风格，所以我删除它读取代码更容易）：

<div id="loading"> 
<div id="progressbar"> 
<div id="progress"/> 

<script> 
var loading = document.getElementById('loading'); 
var progress = document.getElementById('progress'); 
var progressbar = document.getElementById('progressbar'); 

function updateProgress() 
{ 
    if (loading.style.display !== 'none') 
    { 
     var width = parseInt(progress.offsetWidth + ((progressbar.offsetWidth - progress.offsetWidth) * .15)); 

     if (width > (progressbar.offsetWidth * .95)) 
     width = parseInt(progressbar.offsetWidth) * .5; 

     progress.style.width = width + 'px'; 
     window.setTimeout("updateProgress()", 1000); 
    } 
    } 
document.body.style.margin = 0; 
document.body.style.padding = 0; 
loading.style.display = 'block'; 
updateProgress(); 
</script> 
</div> 
</div>

你能不能帮我添加缺少的代码，以显示一个文本的百分比已经装载好吗？

来源

2012-07-21 nzaero

我忘了：一个解决方案，而JQUERRY – nzaero 2012-07-21 13:51:22

https://developer.mozilla.org/en/DOM/element.innerHTML - 这是设置元素内容的元素属性。

假设你的进度百分比定义为var percent，你只需要在内容设置如下：

progress.innerHTML = percent.toFixed(1) + '%';

来源

2012-07-21 03:08:26 Travis

谢谢你特拉维斯，但是，我的东西有一点点的代码所缺少...我已尝试添加： < div id = percent /> var percent = document.getElementById（'percent'）; progress.innerHTML = percent.toFixed（1）+'％'; 就是这样吗？我认为它不工作...（我真的不懂Javascript） – nzaero 2012-07-21 14:07:01

这是一个完整的工作示例，不使用任何jQuery（虽然它设置为加载，我没有使用它）：http://jsfiddle.net/ xYDhF/ – Travis 2012-07-21 15:01:54

你知道与Chrome Inspector说：未捕获TypeError：对象＃没有方法'toFixed' – nzaero 2012-07-22 23:06:59

取而代之的是，你可以尝试Query Loader。

这个预加载器拥有一切。加载栏，自定义动画并获取网页中包含的所有图像。

你可以看到一个演示here

来源

2012-07-21 04:40:59

如何在JavaScript中为我的进度条设置百分比？

回答

相关问题