如何在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中爲我的進度條設置百分比？

回答

相關問題