Javascript 自由文本输入，在特殊符号上自动完成

我正在构建一个聊天小部件，允许人们在web应用程序中相互交谈。因此，大部分聊天都是文字，但我想让人们说

在聊天中应显示为（例如）

其中，键入

@

符号允许从用户列表中自动完成

Joe

，并将其呈现为某种HTML元素，而不仅仅是文本

一个很好的例子是在StackOverflow上询问或编辑问题时的标签框-您可以键入自由文本，自动完成一个或多个标签；我基本上希望标签用一个特定的符号激活（在本例中为

@

），否则仍然允许自由文本。另一个例子是StackOverflow中的评论回复字段，您可以在其中键入

@fooUser这是我对您的评论的回复

，并且

fooUser

成为链接

GitHub也这样做；它为

#

（问题）和

@

（用户）提供不同的自动完成功能，即：

我知道像和这样的库，但它们似乎能自动完成整个输入，并且不够灵活，无法进行类似的操作。这里有两个主要问题：

• 在输入字段上混合呈现文本和任意DOM元素的好方法是什么
• 是否有一个自动完成库支持在线自动完成，而不仅仅是对整个输入

我也可以不在文本输入/文本区域中呈现DOM元素，但我找不到任何库可以实现这种混合自由文本/自动完成

顺便说一句，我在Meteor中做这个，所以自动完成的数据源将是一个。虽然这不会对数据的连接方式产生太大的影响，但一个流星感知的答案将更有帮助

---

与相关，但这个问题已经两年多了，没有好的答案，希望现在有更好的答案出现。

在广泛的图书馆调查中没有发现什么太有希望的东西，但我想我会写下来以供参考

我排除了所有的全域自动完成库，比如Typeahead和jqueryautocomplete，因为它们不是我真正想要的

• （仅支持一个触发器）
• （也只有一个触发器）
• （一个触发器，未维护）
• （不太完整）

---

在这一点上，我相当确定，除非GitHub决定开放其代码，否则没有任何工业实力库：）。祈祷吧…

为此，值得创建一个Meteor软件包：

Meteor中的客户端数据同步使其功能强大且非常灵活。支持多个匹配规则和使用模板的自定义列表呈现：

提及用户，在线用户显示为绿色：

提及其他内容，并显示一些元数据

---

有关更多详细信息，请参阅链接。请用叉子叉，拉，改进

对于您在输入字段上呈现文本和dom元素的第一个问题，我可以想到的一种方法可能是使用html5 contenteditable属性，它具有相当好的浏览器支持，甚至IE.@kenttam谢谢，但我需要一种全面的方法来做到这一点，在黑暗中到处拍摄的花絮不多。可惜我不能使用流星包：(