使用jQuery将文本插入textarea

Question

我有一个textarea和一个除了它之外的几个变量的列表.我需要能够单击变量并将其放入文本区域.

<div id="var1" class="insert">Name</div>
<div id="var2" class="insert">Street address</div>

<textarea id="targetText">some text already here</textarea>

插入后我需要它看起来像:

<textarea id="targetText">some text already here {Street address}</textarea>

我在考虑使用点击功能:

$(".insert").click(function () {
        // some magic to add to textarea
});

Answer 1

如果要在光标处插入变量,则需要selectionStart按如下方式使用:

$('.insert').click(function(e){
    var tav    = $('#targetText').val(),
        strPos = $('#targetText')[0].selectionStart;
        front  = (tav).substring(0,strPos),
        back   = (tav).substring(strPos,tav.length); 

    $('#targetText').val(front + '{' + $(this).text() + '}' + back);
});

请参阅小提琴:http://jsfiddle.net/rKmVL/1/

注意:这可能不会在IE中按原样运行.