AJAX 在大型 HTML 页面加载时从大型 HTML 页面获取数据答案

【问题标题】：AJAX get data from large HTML page as the large HTML page loadsAJAX 在大型 HTML 页面加载时从大型 HTML 页面获取数据
【发布时间】：2010-06-03 12:49:35
【问题描述】：

不完全确定这是否有名称，但基本上我有一个从 db 中的结果生成的大型 HTML 页面。

因此，直接在浏览器中查看 HTML 页面（这是一个报告）不会立即显示所有内容，而是显示它所拥有的内容，并在检索数据库的结果时添加额外的 HTML...

有没有一种方法可以向这个 HTML 页面发出 AJAX 请求，而不是等到整个页面（报告）准备好，我可以在加载 HTML 报告时开始处理响应？或者有其他方法吗？

Atm 我做出了 AJAX 响应，它会在那里等待一两分钟，直到 HTML 页面完成...

如果上下文有任何用处：HTML 报告由 Java servlet 生成，并且进行 AJAX 调用的页面是 JSP 页面。不幸的是，我不能很容易地分解报告，因为它是由 BIRT（Eclipse 报告扩展）生成的。

提前致谢。

【问题讨论】：

如果你不能把报告分成几部分，那就麻烦了
我想我明白了...我正在使用 jQuery 进行 AJAX 调用。编写我自己的 onreadystatechange 侦听器并检查值 3 的 readystates 似乎让我可以访问响应对象的 [不完整] responseText！待我进一步调查后会回复。

标签： java javascript ajax jsp birt

【解决方案1】：

是的，所有的作品，如果有人感兴趣的话：

client.open("GET", reportUrl, true);
client.onreadystatechange = responseListener;
client.send();

var reportContents = document.getElementById("reportContents");
// Since this could considerably slow browsers for large reports,
// don't edit report contents for every readystate equal to 3.
// Do it every 10.
var batchUpdate = 10;
var responsesSinceUpdate = 0;
// Don't update the whole contents, just add the new stuff
// since the last update.
var currentLengthOfReportHtml = 0;
// Have max recommended length of report before showing warning.
var maxRecommendedReportLength = 500000;

function responseListener()
{
    if (this.status == 200)
    {
        var readyState = this.readyState;

        if (readyState == 3 || readyState == 4)
        {
            var updatePage = false;

            if (readyState == 4)
            {
                updatePage = true;
                var loadingDiv = document.getElementById("reportLoading");
                loadingDiv.innerHTML = "";
                toggleLargeReportWarning(false);
            }
            else
            {
                responsesSinceUpdate++;

                if (responsesSinceUpdate > batchUpdate)
                {
                    updatePage = true;
                    responsesSinceUpdate = 0;
                }
            }

            if (updatePage)
            {
                var reportLength = this.responseText.length;
                reportContents.innerHTML += this.responseText.substring(currentLengthOfReportHtml);
                currentLengthOfReportHtml = reportLength;

                if (reportLength > maxRecommendedReportLength && readyState == 3)
                {
                    toggleLargeReportWarning(true);
                }
            }
        }
    }
}

【讨论】：