如何在dropzone.js中顯示上傳進度百分比

Question

我在magento中使用dropzone.js上傳文件。進度條工作正常，但我也想顯示進度百分比。以下功能正在爲一個範圍添加樣式。

uploadprogress: function(a, b) { 
       var c, d, e, f, g; 
       if (a.previewElement) { 
        for (f = a.previewElement.querySelectorAll("[data-dz-uploadprogress]"), g = [], d = 0, e = f.length; e > d; d++) c = f[d], g.push("PROGRESS" === c.nodeName ? c.value = b : c.style.width = "" + b + "%"); 
        return g 
       } 
      }, 

它在下面的html中添加style =「width：xx％」。

我也想顯示％結果哪個克在上面的代碼在span中返回作爲文本，以便用戶也可以看到數字。

Answer 1

假設你有一個像這樣的，例如你的進度條跨度：

<div class="progress"> 
    <div class="progress-bar progress-bar-primary" role="progressbar" data-dz-uploadprogress> 
     <span class="progress-text"></span> 
    </div> 
</div> 

你應該定義你的uplaodprogressfunction如下：

uploadprogress: function(file, progress, bytesSent) { 
    if (a.previewElement) { 
     var progressElement = file.previewElement.querySelector("[data-dz-uploadprogress]"); 
     progressElement.style.width = progress + "%"; 
     progressElement.querySelector(".progress-text").textContent = progress + "%"; 
    } 
}