在DOM元素後移動選區

Question

我目前正在爲Web構建一個Markdown編輯器。 Markdown標籤可通過Range界面實時預覽。下面的代碼使用，這應該是工作根據MDN：

var range = document.createRange() 
var selection = window.getSelection() 

range.setStart(textNode, start) 
range.setEnd(textNode, end + 2) 

surroundingElement = document.createElement('strong') 
range.surroundContents(surroundingElement) 

var cursorRange = document.createRange() 
cursorRange.setStartAfter(surroundingElement) 

selection.removeAllRanges() 
selection.addRange(cursorRange) 

---

Firefox的工作：有些大膽文本

http://f.cl.ly/items/093R343i23402K190k1t/firefox.gif

鉻不是：有些大膽的文字

有什麼建議可能是錯的？關於這個問題的信息很少。

---

回答

感謝@Tim下來，我固定它使用不可見字符的解決方法，他介紹中提到的環節之一就是答案。這是我現在使用的代碼：

var range = document.createRange() 

range.setStart(textNode, start) 
range.setEnd(textNode, end + 2) 

surroundingElement = document.createElement('strong') 
range.surroundContents(surroundingElement) 

var selection = window.getSelection() 
var cursorRange = document.createRange() 

var emptyElement = document.createTextNode('\u200B') 
element[0].appendChild(emptyElement) 

cursorRange.setStartAfter(emptyElement) 

selection.removeAllRanges() 
selection.addRange(cursorRange) 

Answer 1

的問題是，WebKit的已定在哪裏插入符號（或選區邊界）可以去的想法，當你打電話的是選擇你的範圍的修正版選擇的方法addRange()。我已經在Stack Overflow上寫過幾次了;這裏有幾個例子：

• Set cursor after span element inside contenteditable div
• How to set caret/cursor position in a contenteditable div between two divs.