使用 json ajax javascript jquery 和 java（无 PHP）的自动完成搜索栏答案

【问题标题】：Autocomplete search bar using json ajax javascript jquery and java (no PHP)使用 json ajax javascript jquery 和 java（无 PHP）的自动完成搜索栏
【发布时间】：2015-02-03 07:30:14
【问题描述】：

我正在尝试实现类似于 facebook 的自动完成搜索栏（例如单击特定结果时的下拉结果，它应该指向相应的链接）。

我已经让自动完成功能正常工作（搜索结果仅显示文本），但我不确定如何将相应的链接/网址链接到结果。

非常感谢任何帮助。谢谢。

以下是我的 java 的 searchjson 方法，我已将其作为“GET”方法链接到路由。

public static Result searchJSON(String query) {
    List<Account> userAccs = searchAccounts(query);
    ObjectNode json = Json.newObject();
    ArrayNode jsonArray = json.putArray("");
    ObjectNode node = null;
    for(Account acc : userAccs) {
        node = jsonArray.addObject();
        node.put("label", acc.getDisplayName());
        node.put("id", acc.getId());
    }
    return ok(jsonArray);

下面是我的自动完成 javascript

var SearchBar = (function($) {
var search_data = function( request, response ) {
    $.ajax({
        url: "/search.json",
        dataType: "json",
        type: "GET",            
        data: {q: request.term },
        success: function( data ) {
            response( $.map( data, function( item ) {
                return {
                    label: item.label,
                    id: item.id
                  };
               }));
           }
       });
    };

    $("#searchfield").autocomplete({
        source: search_data,
        minLength: 1
     }); 

  return {
      attach: attach_to_bar
  };

}) (jQuery);

【问题讨论】：

标签： javascript jquery ajax json

【解决方案1】：

在您的自动完成构造函数中，您可以使用选项

选择：函数（事件，用户界面）{}

当你选择一个项目时被触发。这样你就可以随心所欲了。

所以你说的是重定向，在这种情况下你可以用 window.location 重定向到那个页面

【讨论】：

好的，但是对于那个“选择”事件是否有任何 API 东西，这样我就可以弄清楚如何实现它？抱歉，我是新手。
如您所见，ui 参数有一个名为 item 的对象，该对象具有用户选择的标签和值。那么你只需做一个 window.location = ui.item.value;