Ajax成功没有设置变量的值

Question

我对我的一个观点有一个简单的 ajax 调用。

var countAnchors;

$.ajax({
    url: countUrl,
    method: "GET",
    data: @Model.InitialTrainingId,
    success: function (result) {
        console.log("result: ",result);
        countAnchors = result;
    },
    error: function (jqXHR) {
        console.log(jqXHR);
        alert("There was a problem");
    }
});

console.log("countAnchors: ",countAnchors);

当我运行它时，在我看到的控制台中：

为什么countAnchors没有在success函数中赋值？

Answer 1

您可以创建一个function，因此每当收到回复时，您都可以为您的variable 赋值，如下所示：

var countAnchors=null;

  function result(r){
    countAnchors= r;//assigning value return
   console.log("countAnchors: ",countAnchors);
  }

    $.ajax({  
        type: "POST",  
        url: "readString.php",  
        data: { 'fn': filename },      
        success: function(response){
            result(response); //calling function
        },
       error: function (jqXHR) {
       console.log(jqXHR);
       alert("There was a problem");
      }
    }); 

Answer 2

你的日志条目给了你一个提示。

除非您另外指定，否则 ajax 调用将异步运行。

在这种情况下，您会在日志中看到您对 countAnchors 值的记录发生在 ajax 调用完成之前。仅仅因为它是在脚本块中较早编写的，并不意味着（在这种情况下）它在脚本块的下一部分执行之前就完成了。

我敢打赌，这会给你一个值，并将这两行以预期的顺序返回到控制台日志：

var countAnchors;

$.ajax({
    url: countUrl,
    method: "GET",
    data: @Model.InitialTrainingId,
    success: function (result) {
        console.log("result: ",result);
        countAnchors = result;
        console.log("countAnchors: ",countAnchors);
        doSomething();
    },
    error: function (jqXHR) {
        console.log(jqXHR);
        alert("There was a problem");
    }
});

function doSomething()
{
    alert('countAnchors: ' + countAnchors);
}

编辑：如果您需要做一些与 countAnchors 的值有关的事情，请创建一个新的 javascript 函数并在设置 countAnchors 后从成功函数中调用它。

Answer 3

因为

console.log("countAnchors: ",countAnchors);

在成功函数之前运行，此时'countAnchors'仍未定义