可以计算出有多少数据被加载使用AJAX? [英] Possible to calculate how much data been loaded with AJAX?
问题描述
我一直忙于一些AJAX code。我想计算有多少数据被加载,我想用百分比显示。
I've been busy with some AJAX code. I want to calculate how much data has been loaded and I want to display it with percents.
我所有的preloaded信息是里面的反馈。 我可以计算出有多少数据包含(以字节为单位),并且我也看到了进步?就像当它装:10KB,20KB,30KB等
All my preloaded info is inside "feedback". Can I calculate how much DATA it contains (in bytes) and can I also view the progress? Like when it has loaded: 10kb, 20kb, 30kb etc
我的code:
function calc(page)
{
$('#pageLoad h2').animate({ marginTop : '0px'}, 200);
$.ajax(
{
url: './pages/page.php',
type: 'POST',
data: 'page='+page,
success: function( feedback )
{
$('#content').html( feedback );
}
});
};
对不起,我的英文不好。
Sorry for my poor english.
推荐答案
它的是的可能。 XHRs有 进度
事件。唯一的问题是访问XHR对象 - 不幸的是 beforeSend
只接收 jqXHR
对象,而不是底层的XHR对象。它也不是作为包装物的属性进行访问。您可以通过添加下列选项, $但挂钩到XHR对象的创建过程阿贾克斯()
:
It is possible. XHRs have a progress
event. The only problem is accessing the XHR object - unfortunately beforeSend
only receives the jqXHR
object and not the underlying XHR object. It is also not accessible as a property of the wrapper. You can however hook into the creation process of the XHR object by adding the following option to $.ajax()
:
xhr: function () {
var xhr = $.ajaxSettings.xhr(); // call the original function
xhr.addEventListener('progress', function (e) {
if (e.lengthComputable) {
var percentComplete = e.loaded / e.total;
// Do something with download progress
}
}, false);
return xhr;
}
下面是我最初的解决方案。这是非常难以与jQuery结合起来,因为你不能轻易地勾到onreadystatechange的处理程序,并不能安全地更换它已设置之后:
Here's my initial solution. It is extremely hard to combine with jQuery since you can't easily hook into the onreadystatechange handler and cannot safely replace it after it has been set:
<打击>您需要添加一个自定义的的onreadystatechange
处理程序。当的readyState
的XHR对象变成 2
(* HEADERS_RECEIVED *),您可以访问内容长度
头得到的总大小,然后等待事件触发与 xhr.readyState == 3
(加载)。
You need to add a custom onreadystatechange
handler. When the readyState
of the XHR object becomes 2
(*HEADERS_RECEIVED*) you can access the Content-Length
header to get the total size and then wait for the event to fire with xhr.readyState == 3
(LOADING).
然后你可以通过查看 xhr.responseText.length
计算的进展。
然而,这将仅一次。所以,你需要启动一个定时器(使用的setInterval()
),这将检查准备状态和反应的大小如每100毫秒。一旦请求完成,然后再次使用停止时间间隔 clearInterval()
。击>
Then you can calculate the progress by looking at xhr.responseText.length
.
However, this will only fire once. So you need to start a timer (using setInterval()
) which will check the ready state and response size e.g. every 100 msecs. As soon as the request finishes you stop the interval again using clearInterval()
.
这篇关于可以计算出有多少数据被加载使用AJAX?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!