Question

我很难理解javascript回调应该如何工作。我使用以下代码从MySQL数据库中获取值：

  $.post("getResults.php", { x: 100, y: 200},       
   function(arrayOfValues){  
      alert( arrayOfValues[2] )         
   }, 'json');

alert()返回正确的值，并按预期运行。但是，我不明白arrayData[2]的值如何传递或返回到我的程序的其他部分（我所做的尝试没有奏效）。

我已经阅读了jquery help以及众多SO问题和答案，但我不明白回调是如何运作的。

在这种情况下，我希望我的主程序可以访问arrayOfValues [2]。

Answer 1

$ .post（）是异步（非阻塞）调用，这意味着函数立即返回（不等待服务器响应）并执行下一个javascript代码。当来自服务器的响应到达时，将调用您的回调函数，并带有响应...

假设您要在div中显示内容：

$.post('url.php', {}, function(content) {
  $('#div_id').html(content);
});

// or shorter:
$('#div_id').load('url.php', {});

或者您可以拥有一个具有某种逻辑的对象，并将对象的方法注册为回调：

function MyHandler(msgElement) {
  var sum = 0;
  this.onSuccess = function(content) {
    sum = sum + content[0];
    if (sum > 100) {
      msgElement.html('Sum has reached 100 !');
    }
  };
  this.otherMethod = function() {
    alert('Current sum is:' + sum);
  };
}

var handler = new MyHandler($('#my_div'));

// do the request
$.post('url.php', {}, handler.onSuccess, 'json');

// you can call any method of handler object using global variable handler
// or passing a reference (handler object) to any other object
// notice, if you call this method immediately after sending the request,
// the sum var is likely to be 0, as the response has not arrived yet...
handler.otherMethod();

基本上，你有很多选择。因此，如果您需要更多信息，请指明您想要做出什么样的响应......

Answer 2

var foo;

$.post("getResults.php", { x: 100, y: 200 }, function(data) {  
    foo = data;       
}, 'json');

响应数据将存储到foo变量中。但请注意，这是一个异步回调函数，在HTTP响应到达时调用。重要的是要了解您无法使用foo变量，直到HTTP响应到达并且回调函数已完成。

Answer 3

回调，让我尝试以你能理解的方式解释它。

首先，您需要了解如何在不执行的情况下将函数分配给变量。

这允许你传递函数并且只在你想要的时候执行它们，这是一个例子，我可以将函数传递给变量而不执行它：

a = function(){}

这是一个小例子，也是最常见的，你可以调用类似a()的函数，添加()告诉函数执行。

现在您应该明白，您可以将这些变量传递给另一个函数，而不是将它们称为

以下示例显示了如何在执行函数时将函数传递给上述函数a。

b = function(){}
b(a);

下一步是能够创建匿名函数，这些函数允许您在传递给另一个函数时为函数赋值函数

在写入时不会分配匿名函数，但在外部函数范围内解析时会分配匿名函数。

以上我有点难以理解，但希望这个例子能清除它。

a(
    function(){}
);

以上与b(a)示例相同，除了a现在是一个匿名函数，并且仅分配给b中的变量，即外部函数。

jQuer'ies API在很大程度上依赖于匿名函数，因为它易于使用并创建与jQuery Core和用户代码的分离，用户不需要严重依赖jQuery的主代码，而是通过回调来允许jQuery而是连接到你的代码。

使用类似的方法将数据传入和传出函数的函数示例如下：

JoinUser = function(Firstname,Lastname,callback)
{
     Fullname = Firstname + " " + Lastname;
     callback(Fullname);
}

JoinUser("Robert","Pitt",function(Fullname)
{
    alert(Fullname); //Robert Pitt
})

上面的例子只是粗略地向你展示了jQuery的样式是如何工作的，而不是回调和Ajax最重要的好处。

Ajax可以暂停javascript脚本，直到收到数据，例如：

Result = RequestPage("Contacts");

当Ajax看到这一行时，它必须等待RequestPage返回结果，因为进一步向下编码需要这个值，所以我们必须在JavaScript之前检查从服务器返回的数据继续，这可能是几秒钟，导致UI异常行为。

我们解决这个问题的方法是向函数发送回调并告诉它在完成时调用，因为我想处理应用程序的其余部分。

RequestPage("Contacts",function(){});

所以现在JavaScript继续在页面上执行它需要的任务，并且在RequestPage函数中它将如下布局：

function RequestPage(page,callback)
{
    //..
        request.oncomplete = callback;
    //..
}

这样你的应用程序的其余部分就完成了其他任务，当结果准备就绪时，你可以从结果中更改UI。

这也是我们使用加载器复制工作状态的原因。

我希望您开始了解jQuery如何利用javaScript的这些因素，它将帮助您开发应用程序。

Answer 4

有很多方法可以处理返回的数据。

设置一个变量，其范围在该内联函数之外，并将值传递给它。

var result;

回调result = arrayData;

中的

您还可以调用函数来对结果执行其他操作。

理解jquery回调

4 个答案: