javascript - 异步ajax调用阻塞UI

标签 javascript ajax asynchronous

渲染 JSP 后,我会尝试通过 ajax 进行异步调用,以在页面上加载附加信息。

我期望 ajax 加载能够优雅地进行,而不会妨碍 UI 滚动条导航。但该调用会阻塞 UI,直到 onLoad 完成。

在其他时候,即使在鼠标单击 ajax 调用时,此服务也会阻止 UI(在加载数据之前,光标保持为指针类型)。

在这两种情况下,我都通过 javascript 构建 DOM(例如为 div 或表创建 innerHTMl)。是因为这个吗?或者是其他东西?我附上了我的 ajax 请求代码。

感谢您的帮助。 (抱歉,我尝试格式化代码,但无法在此处得到它)

function requestService(theService, theParamObj, isSyncCall) {
    var ajaxRequest = getAjaxRequest();  
    var params = "data="; 
    if(theParamObj != null)
        params += encodeURIComponent(JSON.stringify(theParamObj));

    ajaxRequest.onreadystatechange = function() {
        if (ajaxRequest.readyState == 1) {
            showLoadingBox();
        }
        if (ajaxRequest.readyState == 4) {          
            handleResponse(ajaxRequest.responseText, theService, theParamObj);
            hideLoadingBox();
        }
    };

    var queryString = "?timestamp=" + new Date().getMilliseconds() + "&theService=" + theService;
    if(isSyncCall == null)
        isSyncCall = false;
    ajaxRequest.open("POST", g_Service + queryString, isSyncCall);
    ajaxRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    ajaxRequest.send(params);
}

更新: onLoad 调用此服务

function loadAdInfo(){
   var theParamObj = {"REQUEST_URI" : window.location.href};
   requestService('getAdInfo', theParamObj, false);
}

最佳答案

XMLHTTPObject open 方法定义如下:

open(method,url,async)  Specifies the type of request, the URL, and if the request should be handled asynchronously or not.

method: the type of request: GET or POST
url: the location of the file on the server
async: true (asynchronous) or false (synchronous)

你传递的是错误信息。所以你称之为同步

关于javascript - 异步ajax调用阻塞UI,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19809271/

相关文章:

html - 使用 ajax 使用 JSON 数据填充现有表

javascript - Sharepoint 2013 中的事件单击单选按钮 JQuery

javascript - 使用 JS 过滤和搜索 2 个不同的对象数组

javascript - onClick() 执行功能?

javascript - jQuery 解析 RSS 和命名空间元素,如 <content :encoded>

java - 使用 ContentObserver 调用两次同步适配器

javascript - 使用 AJAX 和 PHP 保存用户的照片

ajax - GSP中的Grails remoteFunction AJAX函数,访问用于参数的变量

c++ - 使用 WxWidgets 异步执行

asynchronous - 服务总线 - "The server did not provide a meaningful reply; this might be caused by a premature session shutdown"