在 contentEditable div 中进行标记的方法

Question

我正在尝试为聊天构建用户输入（contentEditable div），其中有人可以写一些东西并标记某人，例如hello @user32。在这种情况下，我希望 @user32 被链接替换并格式化。

我试图了解什么是客户端和服务器的最佳方法。

1. 在将消息发送到服务器@user32 之前，客户端（javascript）是否应该删除<a src="xxx">User32</a> 标签？并且每个接收到消息的客户端都会对其进行处理以显示它？

2. 客户端是否应该将包含链接的完整消息发送到服务器，并且服务器在插入数据库之前对其进行清理？

3. 我是否应该在数据库中插入完整的消息，包括链接，而无需在服务器或客户端上进行预处理/后处理？

我认为选项 1 是保持干净数据的最佳选择，因此它不依赖于客户端，但我担心在 contentEditable div 中有一个可见的格式化消息并维护要发送到服务器的隐藏数据，或者有一个简单的方法来做到这一点？还是我仍然应该使用选项 1 并在发送前清理消息？即用原始@user32 的特定标签/类替换所有链接？

Answer 1

我过去确实使用过this library，并且对我来说效果很好，即使当时没有使用内容可编辑的 div，而是使用了更大的输入。

我建议您尝试一下并检查它是否符合您的需求。