的JavaScript setSelectionRange（）方法和光標位置

Question

我有以下動態插入Unicode字符片的JavaScript的 - 由txtToIns變量表示如下 - 成文本

elmt.value = elmt.value.substring(0, elmt.selectionStart) + txtToIns + " " + elmt.value.substring(elmt.selectionStart, elmt.selectionEnd) + elmt.value.substring(elmt.selectionEnd, elmt.value.length) + " "; 
elmt.focus(); 
elmt.value = elmt.value.trim(); 

的主體隨着光標上方總是在文本的末尾。有什麼方法可以直接放在txtToIns之後嗎？不，txtToIns.focus（）將無法工作

Answer 1

我不確定你想要怎麼處理textarea值中的空格字符，尤其是最後一個，它會在兩行之後再次修剪掉，所以我忽略了我的空間代碼如下。我也不確定你想要對之前選擇的文本做什麼（如果有的話），所以我會假設你想用新文本覆蓋它。

牢記這不會在IE < 9，不支持selectionStart，selectionStart或setSelectionRange()工作。

演示：http://jsfiddle.net/timdown/wPfVn/

代碼：

var val = elmt.value; 
var start = elmt.selectionStart, end = elmt.selectionEnd; 
elmt.value = val.slice(0, start) + txtToIns + val.slice(end); 
elmt.focus(); 
var caretPos = start + txtToIns.length; 
elmt.setSelectionRange(caretPos, caretPos); 

Answer 2

當您更改值，光標移動到結束。更改其值後，您將不得不手動重置光標位置。

試試這個：

var start = elmt.selectionStart, 
    len = txtToIns.length, 
    pos = start + len; 
elmt.value = elmt.value.substring(0, start) + txtToIns + " " + elmt.value.substring(start) + " "; 
elmt.focus(); 
elmt.value = elmt.value.trim(); 
elmt.setSelectionRange(pos, pos, 0); 

我還清理了在你設置的值行一些不必要的邏輯。希望我沒有破壞任何東西，但是如果我這樣做了，只需回到原來的路線。