始终在jQuery自动完成中显示特定选项，即使它与输入不匹配

我有一个jQuery自动完成（jquery ui版本1.8），其中我键入一个名称。 如果可用，我希望用户从列表中选择一个名称，因为这些是我们数据库中的所有者名称。 但是，他们需要添加一个新的所有者名称，在这种情况下，我希望他们从自动完成的下拉列表中选择“添加新”。 问题是，如果我在自动完成源数据中包含“添加新”作为选项，则它不会在自动完成下拉列表中显示为选项，因为它与用户在文本框中键入的内容不匹配。

以下是javascript代码。 我不包括服务器端代码，但是假设服务器的结果在下拉列表中创建了一个列表，例如“Add New，Betty，Bob，Cathy，Dan，Edward”。 ‘selector’是text类型的标准html输入字段。

$('.selector').autocomplete({ autoFocus: false, minLength: 1, focus: function (event, ui) { $('.selector').val(ui.item.value); return false; }, select: function (event, ui) { $('.selector').val(ui.item.value); return false; } }); $('.selector').keyup(function(){ // Each time a new character is entered, recreate the drop down list by matching entered characters to beginning of first name field $.ajax({ type: "POST", url: "(url to c#.net asmx page and method)", contentType: "application/json; charset=utf-8", data: '{(various data parameters)}', datatype: "json", error: function (data) { var data = $.parseJSON(data.responseText); alert("Error: " + data.Message); }, success: function (data, status, info) { if (data.hasOwnProperty("d")) { var nameList = data.d; } else { var nameList = data; } $('.selector').autocomplete("option", "source", nameList); } }); }); 

我意识到我已经从我的ajax调用的url和数据部分的javascript代码中删除了几个块，但我认为这没关系，因为获取我的自动完成的“源”不是问题。

需要发生的是，例如，当我输入字母b时，我需要在列表中看到“添加新的，比尔，贝蒂”作为我的三个选择但是现在我只看到“比尔，贝蒂”，因为有“添加新”中没有“b”。

有关如何使“添加新”选项始终可用的任何想法或解决方案？

非常感谢你提前。

Answer 1

我认为自动完成function会将检索到的对象集合构建为无序列表。 喜欢 – >

 
 
 item 1 
 
 item 2 
 
 item 3 
  

它还有一种方法可以检测何时使用open事件打开列表。

 $('selector').autocomplete({ open: function(){ $('.ui-autocomplete').prepend('
 Add New 
'); } }); 

您可以看到我们在打开时向自动完成下拉菜单添加了一个列表项，因此您始终可以在列表顶部获得“添加新项”（jQuery的.prepend（）处理）。