Javascript:在数据库中获取和保存文本选择范围

Question

我正在为客户构建语法检查系统，用户可以在其中向给定文本添加评论/建议。当用户选择一些文本时，会出现一个按钮来为给定的文本选择创建评论/建议。当我想将文本选择范围以及评论/建议保存在数据库中时，我的问题就来了。

我目前正在尝试使用 Rangy ( http://rangy.googlecode.com/ ) 来解决问题。

这些是我到目前为止尝试过的想法:

• 使用 rangy 序列化程序序列化范围。的问题这种方法是 DOM 每次都在改变一个新的添加了评论/建议，因此不允许反序列化成功。
• 使用范围选择包装器并将其直接保存在数据库，但像上面的想法，目标元素内容是随着每个评论/建议而改变，这再次使方法没有按预期工作。

任何关于我如何解决这个问题的建议都会被采纳。

Answer 1

我没用过rangy。但这是我处理它的一种方法。

1. 从元素 ( tutorial here ) 中获取选定的文本

2. 然后添加一个带有特定 id 的包装器 span。 (你可能想从你的服务器获取一个唯一的 ID)

3. 然后显示一个表单以输入评论。

4. 提交时，将 span id 和评论发送到服务器并将其存储在数据库中。

5. 重新渲染时，您可以轻松地为这个跨度分配一个类来标记它并使用 css 在悬停时显示评论。

6. 这将为您提供一个类似于 google 文档的系统，您可以在其中对文本进行评论。

让我知道这是否有帮助，或者您需要更多关于如何完成各个步骤的解释。

这样做的好处是您不需要将选定的文本发送回服务器或担心序列化。只是你包裹它的 span 的 id。