jQuery UI Autocomplete 的“源”回调中的“响应”和“请求”参数是什么？

Question

我在看自动补全教程，有几个问题：http://jqueryui.com/demos/autocomplete/#option-disabled

$( "#tags" )
            // don't navigate away from the field on tab when selecting an item
            .bind( "keydown", function( event ) {
                if ( event.keyCode === $.ui.keyCode.TAB &&
                        $( this ).data( "autocomplete" ).menu.active ) {
                    event.preventDefault();
                }
            })
            .autocomplete({
                minLength: 0,
                source: function( request, response ) {
                    // delegate back to autocomplete, but extract the last term
                    response( $.ui.autocomplete.filter(
                        availableTags, extractLast( request.term ) ) );
                },
                focus: function() {
                    // prevent value inserted on focus
                    return false;
                },
                select: function( event, ui ) {
                    var terms = split( this.value );
                    // remove the current input
                    terms.pop();
                    // add the selected item
                    terms.push( ui.item.value );
                    // add placeholder to get the comma-and-space at the end
                    terms.push( "" );
                    this.value = terms.join( ", " );
                    return false;
                }
            });

所以我知道源的参数是request 和response。这些是保留关键字吗？将其输入谷歌时，我找不到任何东西。我不清楚这里传递的请求和响应是什么。请求只是获取输入吗？我在哪里可以阅读更多关于这方面的信息？

Answer 1

不，request 或 response 不是保留关键字 - 如果是，您不能将它们用作函数参数名称..

这里发生的事情非常简单，如果你曾经在 Node 中做过任何事情，你就会看到这种模式。它是异步 JavaScript。

您将匿名函数传递给source。每当自动完成需要查询数据源（换句话说，用户输入了某些内容）时，都会调用此函数。

函数的参数是request和response。 request 只是自动完成请求的信息； request.term 是查询（用户输入的内容）。如何实现搜索取决于您 - 也许您有一个具有可能性的局部变量，或者您可能会对服务器进行 AJAX 调用。

现在最重要的部分是：如果您正在进行 AJAX 调用，您不能简单地从 source() 中获取一个值 return，因为该函数将在 AJAX 调用完成之前很久就返回。这就是为什么有一个response 参数。

response 是传递给source() 函数的函数引用，只要您有请求的答案就调用该函数。通过闭包的魔力，您可以从 AJAX 回调内部调用此函数。

response（命名为callback 可能更容易混淆）需要一个字符串数组或具有label 和value 属性的对象数组。它会在自动完成下拉菜单中显示这些结果。

把它们放在一起：

$('selector').autocomplete({
    ...
    source: function(request, response) {
        // calculate results for a query.
        response([{ label: 'Example', value: 'ex'  }]);
    }
});

Answer 2

request 和response 只是代码作者选择给分配给自动完成小部件source 选项的回调的两个形式参数的名称：

只需指定源选项，即可自定义自动完成以使用各种数据源。数据源可以是：

• 包含本地数据的数组
• 一个字符串，指定一个 URL
• 回调

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

• 一个请求对象，有一个名为“term”的属性，它指的是 到文本输入中当前的值。例如，当用户 在城市字段中输入“new yo”，自动完成项将等于 “新哟”。
• 响应回调，它需要一个参数 包含要向用户建议的数据。应过滤此数据 基于提供的术语，并且可以采用所描述的任何格式 以上用于简单的本地数据（字符串数组或对象数组） 标签/值/两个属性）。提供自定义时很重要 源回调来处理请求期间的错误。你必须永远 即使遇到错误也调用响应回调。这个 确保小部件始终具有正确的状态。

Answer 3

它在 jQuery UI 自动完成页面中有明确的记录。

http://jqueryui.com/demos/autocomplete/

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

一个请求对象，具有一个名为“term”的属性，它指的是 到文本输入中当前的值。例如，当用户 在城市字段中输入“new yo”，自动完成项将等于 “新哟”。

一个响应回调，它需要一个参数 包含要向用户建议的数据。应过滤此数据 基于提供的术语，并且可以采用所描述的任何格式 以上用于简单的本地数据（字符串数组或对象数组） 标签/值/两个属性）。提供自定义时很重要 源回调来处理请求期间的错误。你必须永远 即使遇到错误也调用响应回调。这个 确保小部件始终具有正确的状态。