在內容中關閉span標籤可編輯div

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; 顏色：紅色; }

<跨度ID = 「fill_me」 >目標< /跨度>

$（ '換句話說 '）insertAfter（' ＃fill_me'）;