jquery自动完成自定义菜单项答案

【问题标题】：jquery autocomplete custom menu itemjquery自动完成自定义菜单项
【发布时间】：2013-07-01 22:41:09
【问题描述】：

我正在搜索 jquery 自动完成功能以搜索服务器上的实体。我希望能够通过将项目“创建实体”作为最后一个结果，或者仅在没有找到结果时才结果，来从搜索结果列表中创建新实体。从文档看来，当我选择“从结果列表中创建实体”时，我会使用 select 事件创建一个新实体。但是，我有点不确定将这个额外项目添加到列表中的正确方法，包括当没有搜索结果时。

我正在使用 JQuery UI 1.10

【问题讨论】：

标签： jquery jquery-autocomplete

【解决方案1】：

首先，您可以覆盖源方法以返回一组自定义响应。在这种情况下，创建实体总是附加到返回的列表中。然后处理选择事件以提示实体。

 var availableTags = ['car', 'duck', 'house'];
 $('#elementID').autocomplete({
      source: function( request, response ) {
          var responses = $.ui.autocomplete.filter(availableTags, request.term);
          responses.push('Create Entity');
          response( responses );
      },
      select: function( event, ui ) {
          var choice = ui.item.value;
          if (choice == 'Create Entity') {
              var selection = prompt('New Entity', 'default value');
              availableTags.push(selection);
              console.log(selection);
              this.value = selection;
              return false;
          }
      }
  });

jsFiddle

【讨论】：

我在尝试您的解决方案时收到此错误消息：Uncaught TypeError: Object #
错误结果来自 varresponse = $.ui.autocomplete.filter(availableTags, request);
@CoderJoe，问题在于没有使用request 而不是request.term。我添加了更多更改并提出了一个小提琴。它应该可以解决问题。