Insertar texto después de la posición del cursor en el texto es

Question

El siguiente script inserta texto al final del área de texto. Necesito cambiar a insertar texto después de la posición actual del cursor en el área de texto.

jQuery(document).ready(function($){ 
    $('#addCommentImage').click(function(){ 
     var imageLoc = prompt('Enter the Image URL:'); 
     if (imageLoc) { 
      $('#comment').val($('#comment').val() + '[img]' + imageLoc + '[/img]'); 
     } 
     return false; 
    }); 
}); 

Answer 1

Usted puede retirar this answer. El plugin jquery insertAtCaret parece muy agradable.

Answer 2

He modificado varias versiones de estos para obtener una versión que coloca el primer texto antes de lo que haya seleccionado y el segundo después de lo que ha seleccionado y mantener seleccionado lo que está seleccionado. Esto funciona en Chrome y FF, no en IE.

jQuery.fn.extend({ 
insertAtCaret: function(myValue, myValueE){ 
    return this.each(function(i) { 
    if (document.selection) { 
     //For browsers like Internet Explorer 
     this.focus(); 
     sel = document.selection.createRange(); 
     sel.text = myValue + myValueE; 
     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(startPos,endPos)+myValueE+this.value.substring(endPos,this.value.length); 
     this.focus(); 
     this.selectionStart = startPos + myValue.length; 
     this.selectionEnd = ((startPos + myValue.length) + this.value.substring(startPos,endPos).length); 
     this.scrollTop = scrollTop; 
    } else { 
     this.value += myValue; 
     this.focus(); 
    } 
    }) 
    } 
}); 

Uso: $('#box').insertAtCaret("[Before selection]", "[after]"); También: no reclamar esto como la mina de ninguna manera.

Answer 3

si el anterior no funciona (no lo hizo en mi caso - tal vez mi configuración es poco diferente), aquí es otra solución:

Se puede utilizar esta función de extensión para obtener la posición:

(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); 

el uso es: var position = $("#selector").getCursorPosition()

para insertar texto en la posición:

var content = $('#selector').val(); 
var newContent = content.substr(0, position) + "text to insert" + content.substr(position); 
$('#selector').val(newContent); 

Eso es todo.