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。这些保留的关键字是？在google中键入此内容时，我找不到任何内容。我不清楚这里传递的请求和响应是什么。请求只是抓住输入？我在哪里可以阅读更多内容？

Answer 1

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

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

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

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

现在重要的部分：如果你正在进行AJAX调用，你不能简单地return来自source()的值，因为该函数将在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选项分配的回调的两个形式参数提供的名称：

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


包含本地数据的数组

一个String，指定一个URL

a Callback


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


一个请求对象，其中包含一个名为“term”的属性   到文本输入中当前的值。例如，当用户   在城市字段中输入“new yo”，自动填充术语将相等   “new yo”。

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

Answer 3

在jQuery UI自动完成页面中清楚地记录了它。

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

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

一个请求对象，其中引用了一个名为“term”的属性   到文本输入中当前的值。例如，当用户   在城市字段中输入“new yo”，自动填充术语将相等   “新哟”。

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

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

3 个答案: