AJAX没有更新变量变量、AJAX

2023-09-10 14:24:36 作者:走下去,别回头。

我想提出一个AJAX请求更新一个变量()与来自服务器的响应值。这里是code我使用的:

I am making an AJAX request that updates the value of a variable (foo) with a response from the server. Here is the code I am using:

//## My variable ##

var foo = "";


//## Send request ##

$.ajax({
    url: "/",
    dataType: "text",
    success: function(response) {
        foo = "New value:" + response;
    },
    error: function() {
        alert('There was a problem with the request.');
    }
});


//## Alert updated variable ##

alert(foo);

问题是,的价值仍然是一个空字符串。我知道,这是不是与服务器端脚本有问题,因为我要么得到一个错误警报或至少是字符串新价值。

The problem is that the value of foo remains an empty string. I know that this is not a problem with the server-side script, since I would either get an error alert or at the very least the string "New value:".

下面是一个的jsfiddle演示该问题: http://jsfiddle.net/GGDX7/

Here is a JSFiddle that demonstrates the problem: http://jsfiddle.net/GGDX7/

为什么值没有变化?

我想提出一个AJAX请求更新一个变量()与来自服务器的响应值。这里是code我使用的:

I am making an AJAX request that updates the value of a variable (foo) with a response from the server. Here is the code I am using:

//## Compatibility ##

var myRequest;
if (window.XMLHttpRequest) {
    myRequest = new XMLHttpRequest();
} else if (window.ActiveXObject) {
    myRequest = new ActiveXObject("Microsoft.XMLHTTP");
}


//## My variable ##

var foo = "";


//## Response handler ##

myRequest.onreadystatechange = function() {
    if (this.readyState === 4) {
        if (this.status === 200) {
            foo = "New value:" + this.responseText;
        } else {
            alert('There was a problem with the request.');
        }
    }
};


//## Send request ##

myRequest.open('GET', "response.php");
myRequest.send();


//## Alert updated variable ##

alert(foo);

问题是,的值保持为空字符串。我知道,这是不是与服务器端脚本有问题,因为我要么得到一个错误警报或至少是字符串新价值。

The problem is that the value of foo stays an empty string. I know that this is not a problem with the server-side script, since I would either get an error alert or at the very least the string "New value:".

下面是一个的jsfiddle演示该问题: http://jsfiddle.net/wkwjh/

Here is a JSFiddle that demonstrates the problem: http://jsfiddle.net/wkwjh/

为什么值没有变化?

推荐答案

目前,当你提醒的价值点,成功处理程序还没有被解雇。既然是成功的处理程序,重新分配的变量,它的价值仍然是一个空字符串。

At the point when you alert the value of foo, the success handler has not yet fired. Since it is the success handler that reassigns the variable, its value remains an empty string.

事件的时间表看起来是这样的:

The timeline of events looks something like this:

被赋予空字符串 在AJAX请求创建和调度。 的值被惊动。 (请注意,还没有发生变化) 在AJAX请求完成。 富=新价值:+ this.responseText; foo is assigned the empty string AJAX request created and dispatched. The value of foo is alerted. (Note that foo hasn't changed yet) AJAX request completes. foo = "New value:" + this.responseText;

由于我们要提醒的值的在的它已经改变了,解决的办法是把警报的成功回调。

Since we want to alert the value of foo after it has changed, the solution is to put the alert in the success callback.

现在,将接收到Ajax响应后执行。

Now it will be executed after the AJAX response is received.