2

我有一个带有状态更新文本框的社交网站，很像 facebook。但是，我还希望用户能够在输入新状态时输入 @ 符号，这会显示朋友个人资料的自动完成选项（再次与 facebook 相同）。

当用户选择一个时，它应该作为指向该个人资料的链接包含在状态中。

我见过许多 jquery 的自动完成插件，包括 fcbkComplete 插件，但这些插件只允许您从 JSON 数据中选择项目，并且不包括您自己的文本。

例如，我可能想输入：“我今天在查看@Paul Hinett 的个人资料，发现他是@Jack 的朋友”

2 个配置文件名称应该是链接。

希望有人能帮忙！

4

2 回答 2

0

这个插件似乎是部分解决方案：https ://github.com/loopj/jQuery-Tokenizing-Autocomplete-Plugin

于 2011-01-06T17:03:13.777 回答
0

当人们在状态创建框中引用朋友时在 Facebook 上创建的那些标记被非正式地称为提及或标签。

看起来你正在寻找一个现有的、强大的解决方案来创建这些东西；如果是这种情况，请查看Mentionator，它是由您真正维护的。

另一方面，如果您对如何制作这样的实用程序感兴趣，请继续阅读。

“提及”管理实用程序具有 3 个组件：

  1. 自动完成模块：负责获取和显示可用于创建提及的项目集的组件，给定一个字符串。

  2. 提及跟踪模块：负责跟踪提及相关数据的组件；至少应在对附加实用程序的输入元素文本的所有修改过程中跟踪每个提及的位置以及表面和实质（如果存在）值。

  3. 提及视觉区分模块：负责将提及文本与附加实用程序的输入元素中的其余文本区分开来的组件*

如果您有兴趣了解这些模块中的每一个在代码方面的外观，您可以查看 Mentionator 的源代码，该代码结构良好、易于理解且注释丰富！**

*重要的是要注意，Facebook 对此类设施的实施不会在创建状态时将提及转化为链接，正如我推断您所暗示的那样。相反，状态文本被发送到 Facebook 的服务器，其中包含（可能是内联的）数据，这些数据指定状态中每个提及的位置。当状态要从服务器传递给用户时，上述位置数据用于创建带有“链接”提及文本的文本版本。

** Mentionator 的自动完成模块是 jQuery UI Autocomplete 小部件，其来源不包含在 Mentionator 中。

于 2016-07-02T22:15:28.840 回答