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

What are the "response" and "request" arguments in jQuery UI Autocomplete's "source" callback?

提问by Strawberry

I'm looking at the autocomplete tutorial, and I have a few questions: http://jqueryui.com/demos/autocomplete/#option-disabled

我正在看自动完成教程，我有几个问题：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;
                }
            });

So I understand the parameters for source is requestand response. Are these reserved keywords? I couldn't find anything when typing this into google. I am unclear as to what is the request and response being passed into here. Is the request just grabbing the input? Where can I read up more on this?

所以我理解 source 的参数是request和response。这些是保留关键字吗？在谷歌输入这个时我找不到任何东西。我不清楚这里传递的请求和响应是什么。请求只是获取输入吗？我在哪里可以阅读更多相关信息？

回答by josh3736

No, requestor responseare not reserved keywords – if they were, you couldn't use them as function parameter names..

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

What's going on here is pretty simple, and if you ever do anything in Node you'll see the pattern. It's async JavaScript.

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

You're passing an anonymous function to source. This function is called whenever autocomplete needs to query the datasource (in other words, the user typed something).

您正在将匿名函数传递给source. 每当自动完成需要查询数据源时（换句话说，用户输入了一些东西），就会调用这个函数。

The function's parameters are requestand response. requestis simply the information autocomplete is requesting; request.termis the query (what the user typed). It's up to you how to implement the search – maybe you have a local variable with possibilities or you might make an AJAX call to the server.

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

Now the important part: if you're making an AJAX call, you can't simply returna value from source()because the function will return long before the AJAX call completes. That's why there's a responseparameter.

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

responseis a function reference passed to your source()function that you call whenever you have the answer to the request. Through the magic of closures, you can call this function from inside an AJAX callback.

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

response(which could less confusingly be named callback) expects an array of strings or of objects with labeland valueproperties. It will show those results in the autocomplete dropdown.

response（它可以不那么令人困惑地命名callback）需要一个字符串数组或具有label和value属性的对象。它将在自动完成下拉列表中显示这些结果。

Putting it all together:

把它们放在一起：

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

回答by Jon

requestand responseare simply the names that the author of the code has chosen to give to the two formal parameters of the callback assigned to the sourceoption of the autocomplete widget:

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

Autocomplete can be customized to work with various data sources, by just specifying the source option. A data source can be:

• an Array with local data
• a String, specifying a URL
• a Callback

The third variation, the callback, provides the most flexibility, and can be used to connect any data source to Autocomplete. The callback gets two arguments:

• A request object, with a single property called "term", which refers to the value currently in the text input. For example, when the user entered "new yo" in a city field, the Autocomplete term will equal "new yo".
• A response callback, which expects a single argument to contain the data to suggest to the user. This data should be filtered based on the provided term, and can be in any of the formats described above for simple local data (String-Array or Object-Array with label/value/both properties). It's important when providing a custom source callback to handle errors during the request. You must always call the response callback even if you encounter an error. This ensures that the widget always has the correct state.

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

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

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

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

回答by asawyer

It's clearly documented in the jQuery UI autocomplete page.

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

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

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

The third variation, the callback, provides the most flexibility, and can be used to connect any data source to Autocomplete. The callback gets two arguments:

A request object, with a single property called "term", which refers to the value currently in the text input. For example, when the user entered "new yo" in a city field, the Autocomplete term will equal "new yo".

A response callback, which expects a single argument to contain the data to suggest to the user. This data should be filtered based on the provided term, and can be in any of the formats described above for simple local data (String-Array or Object-Array with label/value/both properties). It's important when providing a custom source callback to handle errors during the request. You must always call the response callback even if you encounter an error. This ensures that the widget always has the correct state.

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

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

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