将值插入到光标所在的TEXTAREA中

我有一个textarea和一个带有值的div。 当我点击一个值时，我将其插入textarea。 我需要将它插入我的光标在textarea中的位置。 为什么我说WAS？ 因为当我将其移出并单击要插入的值时，我认为它在文本区域中失去焦点。

所以，我的问题是，有没有办法“记住”textarea中的最新光标位置，然后在该位置插入我的值？

也许它可能是字符串中的字符编号？..目前我添加如下：

input.val( function( i, val ) { return val + " " + myInsert + " "; } ); 

我也使用jQuery，也许我可以使用它？

Answer 1

我编写了一个跨浏览器的jQuery插件，用于处理textareas中的插入/选择以及称为Rangy输入的文本输入 （可怕的名字，我真的应该想到更好的一个）。 这种方法的组合和Edgar Villegas Alvarado的答案中的技巧应该可以解决问题 ，尽管在IE中， focusout事件发生得太晚，你需要使用专有的beforedeactivate事件：

 var $textBox = $("#foo"); function saveSelection(){ $textBox.data("lastSelection", $textBox.getSelection()); } $textBox.focusout(saveSelection); $textBox.bind("beforedeactivate", function() { saveSelection(); $textBox.unbind("focusout"); }); 

稍后插入文本时，以下内容将在前一个光标位置插入文本（或覆盖以前选择的文本，如果用户选择了任何文本）：

 var selection = $textBox.data("lastSelection"); $textBox.focus(); $textBox.setSelection(selection.start, selection.end); $textBox.replaceSelectedText("Some new text"); 

请参见这里的jsFiddle示例： http ： //jsfiddle.net/rQXrJ/1/

Answer 2

以下是您要尝试执行的操作示例： http ： //jsfiddle.net/J5Z2n/1/

你好我的好朋友....
你好吗

jQuery：

 function insertAt（myField，myValue，startSel，endSel）{
     if（startSel || startSel =='0'）{
         var startPos = startSel;

         var endPos = endSel;

         myField.val（myField.val（）。substring（0，startPos）+ myValue + myField.val（）。substring（endPos，myField.val（）。length））;

   } 
  其他{

       myField.val（）+ = myValue;

   }
 }

 //调用函数
 var targetBox = $（'textarea＃insert'），
     startSel， 
     endSel;
 targetBox.bind（'focusout'，function（）{
     // insertAtCursor（这个'你怎么做'）;
     startSel = this.selectionStart;
     endSel = this.selectionEnd;
 }）;

     $（“＃myvalue”）。click（function（）{
         var myValue = $（this）.text（）;
         insertAt（targetBox，myValue，startSel，endSel）;

     }）;    

最初的function是从这篇文章借来的http://alexking.org/blog/2003/06/02/inserting-at-the-cursor-using-javascript

这应该会给你一个坚实的开端，我希望。 干杯

Answer 3

如果插入符号（光标）位于文本字段中的某个位置，则它在Javascript中注册为空选择。 也就是说，selectionStart和selectionEnd属性是相同的。 您可以使用这些属性来检测插入符的位置。

Answer 4

显然，selectionStart和selectionEnd在这里非常有用。 看看这个： http ： //www.scottklarr.com/topic/425/how-to-insert-text-into-a-textarea-where-the-cursor-is/

Answer 5

您可以使用jQuery Caret插件来获取/设置光标位置。
用法示例：

 var cursorPosition = $("#textbox").caret().start); 

你可以像这样“存储”这个位置：

 $("#textbox").focusout(function(){ var cursorPosition = $(this).caret().start); $(this).data("lastCursorPos", cursorPosition); }); 

要检索它（在div上单击事件），请执行以下操作：

 var lastCursorPosition = $("#textbox").data("lastCursorPos"); 

希望这可以帮助。 干杯