Вставить текст в выбранную текстовую область

Question

Когда я нажимаю кнопку, я хочу вставить текст в текущее выделенное текстовое поле в текущей позиции каретки. Как это сделать с помощью jQuery или только Javascript?

Я пришел через код, который вставляет текст в определенную текстовую область, но для моего проекта есть несколько текстовых областей.

Answer 1

Это делает все что вы хотите (кроме поддержки старого браузера).

var myText = "sup?", 
    lastActiveElement = null; 

window.addEventListener("focusin", function(e) { 
    lastActiveElement = e.target; 
}); 

document.getElementById("go").addEventListener("click", function(e) { 
    if(!lastActiveElement || lastActiveElement.tagName.toUpperCase() !== "TEXTAREA") { 
     alert("no textarea selected"); 
     return; 
    } 
    var selectionStart = lastActiveElement.selectionStart, 
     value = lastActiveElement.value; 
    lastActiveElement.value = value.substr(0, selectionStart) + myText + value.substr(selectionStart); 
}); 

Демо: http://jsfiddle.net/rfYZq/2/

focusin В магазинах событий последнего сосредоточенный элемента в вар.

Answer 2

(function ($, undefined) { 
    $.fn.getCursorPosition = function() { 
     var el = $(this).get(0); 
     var pos = 0; 
     if('selectionStart' in el) { 
      pos = el.selectionStart; 
     } else if('selection' in document) { 
      el.focus(); 
      var Sel = document.selection.createRange(); 
      var SelLength = document.selection.createRange().text.length; 
      Sel.moveStart('character', -el.value.length); 
      pos = Sel.text.length - SelLength; 
     } 
     return pos; 
    } 
})(jQuery); 

В принципе, использовать его в текстовом поле, выполните следующие действия:

$("#myTextBoxSelector").getCursorPosition(); 

Answer 3

Я получил этот сценарий где-то еще, но я не могу найти закладку для него.

Это добавляет метод к JQuery, который позволит вам сделать следующее:

$("#selectedTextarea").insertAtCaret(myText); 

Edit: рабочая скрипку here

И код:

jQuery.fn.extend({ 
insertAtCaret: function(myValue) 
{ 
    return this.each(function() 
    { 
     if(document.selection) 
     { 
      //For browsers like Internet Explorer 
      this.focus(); 
      sel = document.selection.createRange(); 
      sel.text = myValue; 
      this.focus(); 
     } 
     else if(this.selectionStart || this.selectionStart == '0') 
     { 
      //For browsers like Firefox and Webkit based 
      var startPos = this.selectionStart; 
      var endPos = this.selectionEnd; 
      var scrollTop = this.scrollTop; 
      this.value = this.value.substring(0, startPos) + myValue + this.value.substring(endPos, this.value.length); 
      this.focus(); 
      this.selectionStart = startPos + myValue.length; 
      this.selectionEnd = startPos + myValue.length; 
      this.scrollTop = scrollTop; 
     } 
     else 
     { 
      this.value += myValue; 
      this.focus(); 
     } 
    }) 
} 
});