使用 jscript 跟踪对网页上的字段所做的更改？答案

【问题标题】：Tracking the changes made to a field on a web page using jscript?使用 jscript 跟踪对网页上的字段所做的更改？
【发布时间】：2011-05-08 13:57:02
【问题描述】：

我们有一个客户向我们即将开始的项目添加了一个新的“需求”，这让我们有点吃惊。从最终用户的角度来看，这很简单，但作为开发人员，我不知道如何实现它！

我们的用户想要一个 Web 表单文本框（理想情况下是富文本编辑器，例如 CKEditor）来跟踪用户对内容所做的更改。请注意，这不是跟踪是否进行了更改，而是实际突出显示这些更改。基本上，他们追求的是 Microsoft Word 的“跟踪更改”功能！

这个想法是，当一个用户更改包含大量文本的文本框时，用户之间会发出请求，下一个用户将能够轻松识别更改的内容。

我很想知道是否有人做过类似的事情，或者有人对这是否可能或如何可能有任何想法？

【问题讨论】：

感谢您的快速反馈！我应该添加我们可以轻松地对内容进行版本化，以便我们可以与早期版本进行比较，但是我不知道可靠的差异算法可以让我们显示添加和删除的内容（特别是如果大量文本已更改)
我也会看看另一个问题中提供的选项。谢谢！
哦 - 解决方案是基于 asp.net 的，所以我们需要尽量避免在服务器上安装 PHP（这里没有开发人员具备维护它的必要技能）

标签： javascript html change-tracking

【解决方案1】：

有人已经在这里发布了一个很好的答案：

How to highlight changes/difference in one text paragraph from the other?

【讨论】：

谢谢 - 虽然这都是基于 PHP 的，但它让我走上了正确的道路，我在htmldiff.codeplex.com 找到了一个名为 HTMLDiff 的库，我现在正在寻找它来解决这个问题跨度>

【解决方案2】：

嗯...好吧，您可以将框的内容存储在变量中，然后使用差异算法（肯定有一些）来检查 onChange 的更改并适当地格式化，但只会显示差异当用户在框外单击时。这会足够好吗？如果不是，您可以将 onkeypress 事件与 onkeyup 事件进行比较，然后将格式应用于差异？

【讨论】：

谢谢-如果可以的话，我也会接受您的回答，因为他们都帮助我找到了解决方案。非常感谢！
我可以从中得到安慰:)

【解决方案3】：

嗯，您需要某种内容管理解决方案。它需要有版本控制，以便您可以存储不同版本的内容。如果您的内容只是文本，那么做差异并不难。如果它以某种方式构造（HTML 或其他不同于文本的格式），则可能很难识别更改。我认为在后一种情况下，您可以使用不可见的标签标记新文本，例如编辑器将突出显示的<edition version="1.0"> </edition>。您还可以为已删除的文本制作标签。而且您可以不突出显示文本并且不将删除显示为选项。

【讨论】：

谢谢-如果可以的话，我也会接受您的回答，因为他们都帮助我找到了解决方案。非常感谢！