小编典典

设置AJAX进度栏

ajax

好的,我是AJAX的新手。IE知道请求的生命周期,因此使用了ActiveXObject这样的东西。

但是现在我面临一个现实世界的问题。我有一个在后台运行的servlet,它执行许多任务,并且我想显示一个进度条,以显示流程的执行位置,并还显示实际发生的事情。

到目前为止,在服务器端,我可以计算将要开始的进程数,并且可以轻松地添加一个计数器,以便在每个进程完成后递增-因此使我能够找到自己想要显示的百分比。

关于我应该输出从增量等收集的数据的位置,我不确定到目前为止在处理java类中它是否休眠为2个整数。

任何帮助将非常感激。

到目前为止,我已经看到了,在,我想这就是什么样的即时通讯瞄准。

干杯。


阅读 220

收藏
2020-07-26

共1个答案

小编典典

基本上,您希望在HTTP会话中(或在涉及整个应用程序任务的Servlet上下文中)存储对任务的引用以及任务本身的进度。这样,您必须能够在每个HTTP请求上检索有关它的信息。

在JavaScript中,您可以在特定的超时时间或特定的时间间隔后使用setTimeout()setInterval()执行函数。您可以使用它重复触发Ajax请求,以请求进度的当前状态。一旦检索到状态,例如以最大值为100的整数(百分比)的形式,只需更新一些表示进度条的div和/或相应的HTML
DOM树中的百分比文本。

jQuery在引发ajaxical请求以及像这样遍历/操纵HTML
DOM树时非常有帮助。它最大程度地减少了代码冗长和跨浏览器兼容性的麻烦。

想象一下doGet()servlet的如下:

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    String processId = "longProcess_" + request.getParameter("processId");
    LongProcess longProcess = (LongProcess) request.getSession().getAttribute(processId);
    int progress = longProcess.getProgress();

    response.setContentType("application/json");
    response.setCharacterEncoding("UTF-8");
    response.getWriter().write(String.valueOf(progress));
}

然后,您可以像下面这样使用它:

function checkProgress() {
    $.getJSON('progressServlet?processId=someid', function(progress) {
        $('#progress').text(progress + "%");
        $('#progress .bar').width(progress);

        if (parseInt(progress) < 100) {
            setTimeout(checkProgress, 1000); // Checks again after one second.
        }
    });
}
2020-07-26