如何保留文本区域文本更改上的光标位置？

我想实现一个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

如何保留文本区域文本更改上的光标位置？

回答

相关问题