5

jQuery

我正在发出一个 AJAX 请求，该请求foo使用来自服务器的响应来更新变量 ( ) 的值。这是我正在使用的代码：

//## 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);

问题是 的值foo仍然是一个空字符串。我知道这不是服务器端脚本的问题，因为我要么会收到错误警报，要么至少会收到 string "New value:"。

这是一个演示问题的 JSFiddle：http: //jsfiddle.net/GGDX7/

为什么价值foo不变？

纯JS

我正在发出一个 AJAX 请求，该请求foo使用来自服务器的响应来更新变量 ( ) 的值。这是我正在使用的代码：

//## 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);

问题是 的值foo保持为空字符串。我知道这不是服务器端脚本的问题，因为我要么会收到错误警报，要么至少会收到 string "New value:"。

这是一个演示问题的 JSFiddle：http: //jsfiddle.net/wkwjh/

为什么价值foo不变？

4

5 回答 5

5

在您提醒 的值时foo，成功处理程序尚未触发。由于重新分配变量的是成功处理程序，因此它的值仍然是一个空字符串。

事件的时间线如下所示：

  1. foo分配了空字符串
  2. 创建并发送 AJAX 请求。
  3. 的值foo被警告。（请注意，foo尚未更改）
  4. AJAX 请求完成。
  5. foo = "New value:" + this.responseText;

由于我们想在它发生变化foo 后提醒它的值，解决方案是将提醒放在成功回调中。

现在它将在收到 AJAX 响应后执行。

于 2012-12-14T17:53:26.913 回答
3

“AJAX”中的（第一个）A代表异步。事务不会立即发生，因此您alert()会在远程调用完成之前相当长的一段时间内发生。

于 2012-12-14T17:52:31.647 回答
2

问题是您的警报在请求完成之前被触发。试试这个代码：

我已经将 alert 放到了 的回调函数中$.ajax，这意味着回调函数只会在.ajax部分完成后触发。这将传输新数据，设置变量，然后警告它，而不是同时调用请求和警告变量。

$.ajax({
    url: "/",
    dataType: "text",
    success: function(response) {
        foo = "New value:" + response;
        alert(foo);
    },
    error: function() {
        alert('There was a problem with the request.');
    }
});
于 2012-12-14T17:54:35.290 回答
0

问题很简单...

alert(foo);

将在处理请求时执行，并且foo不会被更改。

如果你这样做：

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

你会看到它按预期工作

于 2012-12-14T17:54:53.387 回答
0

您的警报在 Ajax 请求完成之前执行。试试下面的。var foo = "";

$.ajax({
    url: "/",
    dataType: "text",
    success: function(response) {
        foo = "New value:" + response;

        alert(foo);
    },
    error: function() {
        alert('There was a problem with the request.');
    }
});
于 2012-12-14T17:55:56.520 回答