Ajax 调用未返回正确的变量 [重复]答案

【问题标题】：Ajax call not returning correct variable [duplicate]Ajax 调用未返回正确的变量 [重复]
【发布时间】：2012-03-28 10:38:11
【问题描述】：

可能重复：
jQuery: Return data after ajax call success

我在让这个 ajax 函数工作时遇到问题，不确定我在哪里搞砸了。

var getTotalEntries = function(query) {
  var total;
  $.ajax({
    url: url,
    data: query,
    dataType: 'jsonp',
    success: function(data) {
      console.log(data.total);
      total = data.total;
    }
  });

  return total;     
};

这会将 65 记录到控制台，但返回 undefined...不确定发生了什么。

【问题讨论】：

Ajax 中的 A 代表 asynchronous。如果你可以只 return 来自该函数的值，为什么你必须传递 success 回调？

标签： javascript jquery ajax

【解决方案1】：

Ajax 是异步的。所以继续执行而不等待返回值。你可以这样做：

var getTotalEntries = function(query) {
  var total;      
  $.ajax({
    url: url,
    data: query,
    dataType: 'jsonp',
    success: function(data) {
      console.log(data.total);
      total = data.total;

      //pass the total value here
      processReturn(total);
    },
    //you may want to add a error block
    error: function(e, xhr, settings, exception){

    }
  });

  return total;     
};

编码处理合计的处理方法：

var processReturn = function(total) {
   //use the total value here    
   console.log(total);
};

这应该会解决它。

【讨论】：

【解决方案2】：

ajax 调用和您的 return 语句是异步的，而不是同步的，因此您的 return 语句在 ajax 调用返回并设置变量之前触发。

处理此问题的一种方法是使用成功回调中的数据执行您想要执行的任何操作。

$.ajax({
    url: url,
    data: query,
    dataType: 'jsonp',
    success: function(data) {
      console.log(data.total);
      total = data.total;

      // do stuff with total here, or invoke function that uses total
      doSomething(total);
    }
});

【讨论】：