jQuery高亮显示可编辑div中的单词

问题描述

| 我有一个可编辑的div,想在用户仍在div中键入某些单词时突出显示(应用css类)。 我将如何使用Jquery做到这一点? 我尝试使用
div.html().replace()
等,但将其替换,然后将光标一直移回开头。     

解决方法

        直接更改可编辑div的html会导致问题-保存时,您将无法分辨用户所做的更改与突出显示脚本所做的更改之间的区别。 但是,您可以让用户在编辑纯文本元素的同时使其看起来像在编辑突出显示的元素。在可编辑div的顶部添加第二个div,其样式为指针事件:无和透明背景。只要两个元素具有相同的字体大小,您就可以编辑纯文本版本,但是会看到突出显示的版本中的颜色。 如果字体大小固定,则可以更进一步,并使用textarea代替可编辑的div。我使用这种方法来在iPad上使用语法突出显示编辑器,该编辑器不支持嵌入式HTML编辑。