2012-01-04 85 views
1
$("#to").autocomplete({ 

    //define callback to format results 
    source: function(req, add) { 

     //pass request to server 
     $.getJSON("friends.php?callback=?", req, function(data) { 

      //create array for response objects 
      var suggestions = []; 

      //process response 
      $.each(data, function(i, val) { 
       suggestions.push(val.name); 
      }); 

      //pass array to callback 
      add(suggestions); 
     }); 
    } 
}); 

Source这些回调驾驶我坚果

我试图让熟悉的自动填充功能(jQuery的用户界面),然后我遇到

function (req, add). 

它怎么知道req是输入的数据?

定义的回调add在哪里?

有人能指点我一个有用的教程,所以我可以理解如何使用这些回调?

+0

+1的问题标题。 – martincarlin87 2012-01-04 11:49:51

回答

3

它来自自动完成插件。请参阅:http://jqueryui.com/demos/autocomplete

第三种变体回调提供了最大的灵活性,可用于将任何数据源连接到自动完成。回调得到两个参数:

  • 一个请求对象,带有一个名为“term”的单个属性,它引用了当前文本输入中的值。例如,当用户在城市字段中输入“新哟”时,自动完成词将等于“新哟”。
  • 响应回调,它需要一个参数包含要提示给用户的数据。这些数据应根据提供的术语进行过滤,并且可以采用上述任何用于简单本地数据(String-Array或带有标签/值/两个属性的对象数组)的格式。在请求期间提供自定义源回调以处理错误时,这很重要。即使遇到错误,您也必须始终调用响应回调。这可确保小部件始终具有正确的状态。

更新:

您提供的回调(source: function(req, add) {...})的功能是由插件调用,该插件通过对这些参数的参数。您可以自由选择参数的名称。您可以找到source code on Github。这是传递给你的回调函数中定义line 134

this.response = function() { 
    return self._response.apply(self, arguments); 
}; 

和回调称为line 311this.source是你的回调):

_search: function(value) { 
    this.pending++; 
    this.element.addClass("ui-autocomplete-loading"); 

    this.source({ term: value }, this.response); 
}, 
+0

我可能读过这千多次。我似乎无法掌握响应回调。特别是“添加”方法。该功能在哪里定义? – winteck 2012-01-04 11:42:53

+0

它由插件定义并传递。我会更新答案。 *更新*。 – 2012-01-04 11:45:35

+0

Kling。感谢您的所有帮助,但您如何Javascript程序员追踪所有这些匿名方法?有什么技巧吗?这似乎是自杀企图钻研这些匿名方法。任何好的教程外面?再次感谢。 – winteck 2012-01-04 15:12:21