自由文本输入,特殊符号自动完成
And*_*Mao 14 javascript autocomplete jquery-autocomplete meteor bootstrap-typeahead
我正在构建一个聊天窗口小部件,允许人们在Web应用程序中相互通信.因此大多数聊天都只是文字,但我想让人们说
它应该出现在聊天中(例如)
键入@符号的位置允许Joe从用户列表中自动完成,也可以呈现为某种不仅仅是文本的HTML元素.
一个很好的例子是在StackOverflow上提问或编辑问题时的标签框 - 你可以输入自动填充一个或多个标签的自由文本; 我基本上希望标签用特定符号激活(@在这种情况下),否则仍然允许自由文本.另一个例子是StackOverflow中的注释回复字段,您可以在其中键入@fooUser this is my response to your comment并fooUser成为链接.
GitHub也这样做; 它为#(issue)和@(user)提供了不同的自动完成,即:
我知道诸如Twitter/Bootstrap typeahead和jQuery UI自动完成之类的库,但它们似乎自动完成整个输入并且不够灵活,不能做这样的事情.这里有两个主要问题:
- 在输入字段上处理文本和任意DOM元素的混合渲染有什么好方法？
- 是否有自动完成库支持内联自动完成,而不仅仅是整个输入？
我也没有在文本输入/文本区域中呈现DOM元素,但我找不到任何执行此类混合自由文本/自动完成的库.
另外,我在Meteor中这样做,因此自动完成的数据源将是Meteor集合.虽然这不应该影响数据如何过多地连接,但是流星感知的答案会更有帮助.
与textarea中的Twitter式自动完成相关,但这个问题已经超过2年,没有好的答案,希望现在有更好的东西出现.
为此目的,值得创建一个Meteor包:
Meteor中的客户端数据同步使得它既强大又灵活.支持使用模板的多个匹配规则和自定义列表呈现:
提到用户,在线用户以绿色呈现:
提及其他内容,以及显示的一些元数据
请参阅链接查看更多细节.请分叉,拉动和改进!