如何保留文本區域文本更改上的光標位置？

我想實現一個textarea，它自動地在React中插入關閉的parens，但是每當我修改textarea的value屬性時，光標就會跳轉到正在編輯的文本的末尾。如何保留文本區域文本更改上的光標位置？

這裏是我的onChange功能：

//on change 
    function(event) { 

     var newText = event.target.value 

     var cursorPosition = getCursorPosition(event.target) 
     if(lastCharacterWasParen(newText, cursorPosition)){ 
      newText = newText.slice(0, cursorPosition) + ')' + newText.slice(cursorPosition) 
     } 

     this.setProps({text: newText}}) 

    }

這成功地插入了括號，但如何保存光標位置？

來源

2015-05-06 sak

我以前做過類似的事情。

改變光標位置的方法是使用：evt.target.selectionEnd

在你的情況，你可以在插入之前記錄下來的選定結束，並插入後，將選定結束它應該的位置。

來源

2015-05-06 16:15:39 Surely

'selectionStart'和'selectionEnd'是絕對的路要走，但你必須確定textarea中沒有自定義選擇。 – borisano

@borisano是的，你是對的，我只是想到了它。如果在操作後沒有選擇任何東西，請設置selectionStart = selectionEnd。如果你想選擇任何東西包圍的東西，相應地改變。此外，不知道如果selectionStart> selectionEnd會發生什麼... – Surely

您可以使用selectionStart道具描述here存儲，然後重置光標位置

var cursorPosition = $('#myTextarea').prop("selectionStart");

然後使用類似this設置光標位置

來源

2015-05-06 16:16:25 borisano

如何保留文本區域文本更改上的光標位置？

回答

相關問題