2012-07-31 78 views
0

我正在使用Rangy來選擇和恢復光標位置。Rangy - 在更換innerHTML時恢復光標位置HTML

它做得非常出色,但它並沒有被設計用於以編程方式操縱用戶輸入,並且在DIV的innerHTML中替換了較短的字符串。

我創建上jsbin一個例子示出了什麼在選擇結束時用戶類型的空間發生並且該空間編程剝離出來: http://jsbin.com/ebeqoj/4/edit

的取代的innerHTML比一個瘦長嘗試恢復短所以它失敗了,DIV失去了重點。

我將不勝感激關於如何處理這個問題的建議。例如,有沒有辦法指示Rangy在新字符串的末尾還原遊標?

感謝

回答

2

把插入符的的<div>內容的結束(我一直在使用rangy.getSelection().move("character", userInput2.length-1)沒有成功嘗試)是很容易的:

var sel = rangy.getSelection(); 
sel.selectAllChildren(el); 
sel.collapseToEnd(); 

對於更一般的情況下,您可以創建包含從<div>開始到插入位置的內容的範圍,使用Rangy範圍的text()方法獲得文本,從該文本移除空白並測量其長度。演示:

http://jsbin.com/ebeqoj/5/edit

+0

正確jsbin是http://jsbin.com/ebeqoj/5/edit – Gian 2012-07-31 17:25:37

+0

@Gian:謝謝,我已經更新了我的答案。 – 2012-08-01 08:30:35