使用ajax请求秒更新进度条

基本上，我正在为外部登录系统执行AJAX请求，如何根据请求的长度更新进度条？

例如，请求需要在1.30s到1.40s之间完成，如何根据特定的时间间隔更新进度条，比如每10ms更新一次10％，这里是进度条的HTML布局

 
 65% Complete 
  

进度条的长度使用width: 65%属性确定

这个想法基本上是让它看起来像是根据请求更新，所以当请求完成时，百分比栏已满

Answer 1

我认为这篇文章很清楚http://www.dave-bond.com/blog/2010/01/JQuery-ajax-progress-HMTL5/

发布此信息以供将来参考（如果删除博客）：

 $.ajax({ xhr: function(){ var xhr = new window.XMLHttpRequest(); //Upload progress xhr.upload.addEventListener("progress", function(evt){ if (evt.lengthComputable) { var percentComplete = evt.loaded / evt.total; //Do something with upload progress console.log(percentComplete); } }, false); //Download progress xhr.addEventListener("progress", function(evt){ if (evt.lengthComputable) { var percentComplete = evt.loaded / evt.total; //Do something with download progress console.log(percentComplete); } }, false); return xhr; }, type: 'POST', url: "/", data: {}, success: function(data){ //Do something success-ish } });