html - 在 XMLHTTPRequest.onreadystatechange 中更新 HTML5 进度条

Question

将 XMLHttpRequest 中的两个 HTML5 进度条更新为：

for (var i = 0; i < times.value; i++) {
    xhr.open("POST", uri, false);
    xhr.send(payload);
    restSendBar.value += 100 / times.value;
    console.log(i + "th times");
}

和

xhr.onreadystatechange = function() {
  if (xhr.readyState === 4 && xhr.status === 200) {
      restRxBar.value += 100 / times.value;
  }
};

在 Firefox 中，进度条会随着 for 循环的执行而更新。在 Chrome 中，for 循环完成后会更新进度条。

这是更新进度条的正确方法吗？

这是 Chrome 中的错误吗？

阿伦

Answer 1

可能是 Chrome 对方法调用的优先级与 Firefox 不同。尝试使用以下命令“带外”更新进度条setTimeout：

setTimeout(function() {
  // Update progress bar here
  restRxBar.value += 100 / times.value;
}, 0);