关闭内容可编辑div中的span标记

Question

我正在创建一个内容可编辑的div，我输入的某些单词会变为粗体和红色（使用jQuery等）。我已经通过用适当样式的span标签包含的相同单词替换目标单词来实现这一点。例如：

Target ----> <span style="color:red; font-weight:bold">target</span>

问题是，一旦我用它的跨越版本替换目标单词，我在内容可编辑div中键入的所有其他内容都放在目标单词的span标记内，而不是在它们之外。例如：

* What I want: <span style="color:red; font-weight:bold">target</span> other words
* What happens: <span style="color:red; font-weight:bold">target other words</span>

这是一个优雅的方式吗？我试图避免添加一个包含零宽度字符的额外跨度，并将样式恢复正常。

Answer 1

#fill_me {     font-weight：bold;     红色; }

＆lt; span id =“fill_me”＆gt; target＆lt; / span＆gt;

$（'其他词'）。insertAfter（'＃fill_me'）;