我想在 <textarea> 的某些文本片段中添加彩色波浪形下划线元素。其效果类似于拼写检查器。
我如何使用 javascript 执行此操作，可能还需要 jquery 的帮助？
我对 html 标记的唯一控制是通过 javascript。我的第一个想法是为这些文本片段添加样式，但据我所知，只能为整个文本区域元素添加样式，而不是单个文本片段。
我知道我想要实现的目标是可能的，因为有 commercial software实现了类似的效果，但我仍在尝试弄清楚其中涉及的技巧。
最佳答案
使用的方法是隐藏文本区域并创建一个可编辑的 div(将属性 contenteditable="true" 添加到 div。我不太确定浏览器兼容性)。在每次按键时，javascript 都会抓取所有内容，找到拼写错误的单词并在有问题的单词周围放置一个跨度。他们使用 css 在单词下方放置了红色波浪线下划线(一小段红色波浪线的图像)
考虑到这一点，他们需要跟踪光标在 div 中的位置，以防用户开始在框的中间输入文本，以便在更改内容后脚本将光标返回到正确的位置位置而不是内容 block 的末尾。
此外，您需要在每次按键时更新文本区域的值。
[编辑]
这是概念证明的 jsFiddle: http://jsfiddle.net/tEnY8/
最重要的是，当您在框中键入内容时，值会被放入文本区域，任何不正确的单词都会带有下划线并变为红色。目前它只将最后一个词标记为不正确。您需要注释该行，取消注释 for 循环，并实现 isMispelled(String) 函数。
[编辑]
这是进一步的概念证明:http://jsfiddle.net/tEnY8/4/
基本上我设置了一个拼写正确的单词数组，然后循环检查数组中是否存在该单词；如果不是，那么这个词可能拼错了。
关于javascript - 文本区域的下划线文本，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12492856/