Javascript 在JS中使用计时器和进度条

我试图创建一个简单的脚本，用户点击一个按钮，进度条慢慢地填满100%（我知道是不是很激动？）

因此，我将此片段设置为计时器：

this.updateBar = setInterval(function () { that.update(); }, 50);

我遇到的问题是正确地编写方法，以便进度条慢慢填满。我很明显有逻辑错误，但我深陷其中，看不到它们。这是我所拥有的，显然是不完整的，但甚至不能让我从地面开始

ProgressBar.prototype.update = function () {
   if(this.bar.style.width == "0%")
   {
       this.bar.style.width = "20%";
   }

}

---

谢谢大家!

在ProgressBar构造函数中，添加：

this.progress = 0;

然后将更新功能更改为：

ProgressBar.prototype.update = function () {
    this.progress++; 
    this.bar.style.width = this.progress + "%";
}

---

你有一个好的开始。50毫秒的更新间隔在我看来是相当快的，我建议接近500毫秒。但对于您的功能，类似这样的增量功能可能会更好：

ProgressBar.prototype.update = function () {
  current = this.bar.style.width.split('%')[0];
  if(current !>= 100) {
    current = current + 20;
    this.bar.style.width = current + "%";
  }
}

---

您的更新函数需要传递一个百分比值，或者您的

ProgressBar

对象需要设置特定的总时间，并知道开始时间和当前时间。这些东西通常就是这样工作的。正如您现在看到的，没有任何信息可以让

update（）

函数知道它应该将进度拉到多大程度。我忘了在达到100%后添加一个检查来停止整个过程。你绝对应该这么做！