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分配值？

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

因为

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

在成功功能之前运行，此时“ countAnchors”仍未定义

Answer 3

您的日志条目给了您提示。

除非另行指定，否则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后从成功函数中调用它。