突出显示用户在 Javascript 中对文本所做的编辑

发布于 2024-11-02 19:05:07 字数 213 浏览 6 评论 0原文

我正在尝试在页面中创建一个可编辑的文本字段,该字段突出显示用户在编辑文本时对文本所做的编辑。例如,用户插入或更改的文本应该出现在彩色背景下,删除应该通过向相邻字符添加彩色背景(或者可能是某种符号?)来指示......这似乎比我难得多我想在 Javascript 中做到这一点,令我惊讶的是我找不到任何已经实现这样的文本字段的代码。

你知道有什么可以实现我正在寻找的东西吗?

谢谢!

I'm trying to create an editable text field in a page which highlights the edits made by the user to the text as it is being edited. For instance, text inserted or changed by the user should appear against a colored background, deletions should be indicated by adding a colored background to the neighboring characters (or maybe some kind of symbol?)... It seems to be much harder than I thought to do this in Javascript, and I am surprised that I couldn't find any code already implementing such a text field.

Do you know of anything which implements what I'm looking for?

Thanks!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

£冰雨忧蓝° 2024-11-09 19:05:07

您应该查看 Google 的纯文本差异、匹配和补丁库 它们是开源的,并且可以使用 JavaScript 和其他语言。

差异演示

You should have a look at Google's Diff, Match and Patch libraries for Plain Text which are open source and available in JavaScript among other languages.

Diff demo.

鹿港小镇 2024-11-09 19:05:07

第1步->
将原始值存储在变量 V1

Step2->
将修改后的值存储在变量 V2

Step3->
对于 V2 中的每个单词 [单词至少被一个空格分隔] 对照 V1 检查它,如果不一样,用 HTML 标签突出显示它!

Step1->
Store the original value in a variable V1

Step2->
Store the modified value in a variable V2

Step3->
For each word in V2 [word are divided by at least a single space] check it against the V1, if it's not same HIGHLIGHT it with HTML tag !

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文