Javascript 如何获得像堆栈溢出一样的自动完成

我正在尝试实现一个自动完成，就像堆栈溢出对标记完成所做的那样。然而，我试图查看源代码及其

我试图获得一些特性，比如允许用户添加任何标签，如果它存在于列表中，那么就可以，或者将其添加到数据库中

有没有例子可以说明如何完成这样的事情？或者我可以查看源代码的非精简版本吗？

您可以查看

---

完整的源代码可以在中找到。

我不知道怎么做，但是

如果你仔细研究这个答案：

您可以看到，有一种方法可以修改jQuery的呈现逻辑来更改菜单项的显示方式。还有一个名为renderMenu的内部jQuery函数，它实际提供了选项

我还没有尝试过这个，但我想，通过打开那个黑匣子，替换或重新调整renderMenu及其相关函数，你可以做你想做的事情——在实际的文本框中只渲染一个项目

无论如何，这就是我要开始的地方

---

编辑

我在jQueryUI中再次查看了自动完成功能。通过插入自定义的

response（）

函数来替换菜单显示逻辑似乎非常简单

以下是我所做的：

// display the first item in the list of possible completions
var myResponse =  function( items ) {
    var itemToSuggest, p1, p2;
    if (items.length === 0) {return;}
    itemToSuggest = items[0];
    this.element.val( itemToSuggest );
    p1 = this.term.length;
    p2 = itemToSuggest.length;
    setSelectionRange(this.element[0], p1, p2);
};

var oldFn = $.ui.autocomplete.prototype._response;
$.ui.autocomplete.prototype._response = myResponse;

---

使用jQuery UI自动完成的自动聚焦。这将自动关注列表中找到的第一个项目

---

像Selected这样的东西可能会很好地完成这项工作

---

我查看了jquery UI自动完成示例，但是没有示例显示添加列表中不存在的元素。此外，用户必须单击上下箭头或从列表中选择项目。这意味着当你输入时，这个项目还没有被预选。嗯，看多个远程示例，我想我可以将整个列表发送到后端并循环通过它，如果它不存在，那么添加它。但是，仍然希望根据用户类型进行预选，而不是用户必须单击所需的项目want@curtis，这就是为什么我认为您需要一个指向未统一源的链接，即理解它并添加您想要实现的行为。StackOverflow的代码也是以同样的方式定制的。他们使用的是修改过的版本，我相信，但由于这是不推荐的，您应该像Frederic所说的那样使用jQuery UI autocomplete。这很有趣，但为什么它没有显示所有可用的项目呢？我在您的工作示例的基础上构建了，并提出了一个新问题：对不起，柯蒂斯：我误解了这个问题。我以为您希望在文本框中填写一个单词，而不是下拉菜单。也许除了下拉菜单，您还需要在文本框中添加建议。