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中正常工作。

Answer 2

试试这个：

$(".insert").click(function () {
    var insertText = $(this).text();
       $('#targetText').append(" "+insertText);
});

演示： http://jsfiddle.net/Wkz6U/

Answer 3

$("#targetText").val($("#targetText").val() + "{" + $(this).text() + "}");

感觉神奇。

使用jQuery将文本插入textarea

3 个答案: