更新HTML5進度條內XMLHTTPRequest.onreadystatechange

Question

更新內的XMLHttpRequest 2 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);