在文本框中将光标定位到特定行的特定位置

Question

在文本框中将光标定位到特定行的特定位置

javascriptjquerytextareatextselectiontext-cursor

12

我正在尝试在类似Microsoft Office Outlook的程序中复制“自动更正”功能。

首先，每次用户在行首键入“a”（字母a和一个空格），我想将该文本更改为“*代理人[”

我已经编写了以下代码，如果您在文本区域中从上到下输入，则可以正常工作。但是，如果您在文本区域中的任何其他位置键入，则文本会更改，然后光标移动到文本区域的末尾。

我希望光标始终放置在更改后的文本末尾。

我有变量currentLineNumber中更改的行号，我知道光标需要位于该行的第8个字符之后，但我不知道如何告诉它去那里。

理想情况下，我希望像这样做：

function setCursor(row, position) {
 //.... code to set cursor 
}

我应该怎么做才能完成这个任务呢？我可以接受使用JavaScript或jQuery的解决方案（尽管我觉得jQuery有点难以阅读和理解）。

如果有更好的方法来实现我的需求，我也愿意尝试。

如果你不理解问题，这里有一个jsFiddle链接。

- Wesley Smith

可能是在HTML文本框中设置光标位置的重复问题。 - Jeff Noel

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Leon · Accepted Answer

我已更新你的代码片段，请查看：http://jsfiddle.net/eghpf/2/

我添加了变量currentPosition，它在这个方法中被使用。

function setSelectionRange(input, selectionStart, selectionEnd) {
  if (input.setSelectionRange) {
    input.focus();
    input.setSelectionRange(selectionStart, selectionEnd);
  }
  else if (input.createTextRange) {
    var range = input.createTextRange();
    range.collapse(true);
    range.moveEnd('character', selectionEnd);
    range.moveStart('character', selectionStart);
    range.select();
  }
}

这是来自于jQuery在文本区域设置光标位置的问题。

导致光标始终停留在最后一个位置的原因是：当你调用$('#systemNotesbuilder').val(arrayOfLines.join("\n"));时，整个值都被新值覆盖，并将光标放在该新值后面。设置光标的调用应该在那个调用之后（而且也应该是如此）。