在文本中的光标位置后面插入文本

Question

下面的脚本将文本插入到文本区域的末尾。我需要更改为 在文本区域中当前光标位置之后插入文本。

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

您可以结帐this answer。该insertAtCaret jquery插件似乎非常好。

Answer 2

我已经修改了这些的各种版本，以提出一个版本，将第一个文本放置在所选内容之前，第二个文本放在所选内容之后并保留所选内容。这工作在铬和FF，而不是在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(); 
    } 
    }) 
    } 
}); 

用法： $('#box').insertAtCaret("[Before selection]", "[after]"); 另外：不以任何方式声称这是我的。

Answer 3

如果上述不起作用（它没有我的情况下 - 也许我的配置是有点不同），这里是另一种解决方案：

你可以使用这个扩展功能获得位置：

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

的用法是：

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

01： var position = $("#selector").getCursorPosition()

在位置插入文本

就是这样。