Question

我正在使用全局变量来传递来自AJAX调用的响应：

window.response = null; // most recent response from XMLHttpRequest

// the callback function for XMLHttpRequest
function userObjFromJSON() {
    if (this.readyState == 4) {
        var json = eval('(' + this.responseText + ')');
        window.response = json;
    }
    else {
        indicateLoading();
    }
}

// loads the info for this username on the page
function loadUsernameInfo(username) {
    clearPage();
    getUserInfo(username);
    var profile = window.response; // most recent json response (what if it hasn't come in yet?)
    window.response = null;
    if (profile) {
        indicateLoaded(username);
        fillInProfileInfo(profile);

        getTweets(username);
        var tweets = window.response; // most recent json response (what if it hasn't come in yet?)
        if (tweets) {
            fillInTweets(tweets, MAX_TWEETS);
            var mentions = mentionedUsers(tweets, MAX_TWEETS);
            fillInMentioned(mentions);
        }
        else {
            indicateUnavailableTweets();
        }
    }
    else {
        indicateInvalidUsername(username);
    }
}

问题在于，当控制器函数想要开始填充信息时，AJAX调用还没有总是返回。（如果我在调试器中慢慢地逐步执行它，它可以正常工作。）我可以做些什么来解决这个问题？

我试过这样的事情：

getUserInfo(username);
while (window.response == null); // infinite loop here
var profile = window.response; // most recent json response

但这只是让我的浏览器没有响应。

我对从回调调用所需函数犹豫不决，因为我正在尝试实现模型 - 视图 - 控制器。从模型中调用控制器/视图功能感觉会破坏模式。

Answer 1

这里的最佳做法是将您当前在loadUsernameInfo中的代码放入AJAX调用本身的回调中，而不是依赖于全局变量。这样，当您的响应返回时，执行的回调（而不仅仅是设置window.response变量）将实际继续并更新您的UI并执行任何其他相关任务。

另一种做同样事情的方法就是从现有的回调中调用loadUsernameInfo，例如：

// the callback function for XMLHttpRequest
function userObjFromJSON() {
    if (this.readyState == 4) {
        var profile = eval('(' + this.responseText + ')');
        loadUsernameInfo(username, profile);
    }
    else {
        indicateLoading();
    }
}

希望有所帮助！

Answer 2

function userObjFromJSON() {
if (this.readyState == 4) {
    var json = eval('(' + this.responseText + ')');
    window.response = json;
// why dont you call needed function here ?
}
else {
    indicateLoading();
}

}

为什么在设置window.response？

时不调用所有需要的功能

以最糟糕的方式，您可以使用window.setTimeout等待ajax回复，但最好的方法是使用事件。

Answer 3

您的XMLHttpRequest应该使用onreadystatechange事件。例如：

var xmlHttp=new XMLHttpRequest();
xmlHttp.onreadystatechange=function(){
    if( xmlHttp.readyState!=4 || (xmlHttp.status!=200 && xmlHttp.status!=304))return;
    callback(xmlHttp.responseText);

}

其中callback（）是您希望它调用的函数。 readyState为4表示内容已完成加载。这两个状态条目是为了确保网址没有出错。

AJAX：等待回复？

3 个答案: