如何使用jquery在textarea中添加文本而不删除先前的文本

Question

如何使用jQuery在文本区域中添加文本而不删除先前的文本。

    $('.btn-uservar').on('click', function (){             

         var insertText = $('#uservar').val();                           
         $('#template').append(" "+insertText);

    });

但它只能第一次有效。当我再次单击时，它不起作用。

- Bugfixer

Answer 1

使用val来追加文本域的值，而不是使用append。

$('#template').val($('#template').val() + " "+insertText); 

在DOM中，textarea标签的value和text属性是分开存储的。当您使用append时，文本被追加，但是值被清空，因为它不再与文本一致。我认为您对$('#temnplate').val()的第二次调用返回的是被清空的值，而不是追加的文本。

请参阅此链接中的答案，它很好地解释了这个问题。 append not appending to textarea after text edited

- Padhraic

Answer 2

将其创建成一个函数。我在使用AJAX时遇到过这个问题，只能运行一次，这似乎可以解决问题。将old和new都创建为变量，然后将它们连接起来。

$('.btn-uservar').click(function(){
  appendText();
}


function appendText(){
    var textareaText = $('textarea').val();
    var insertText = $('#uservar').val();
    $('textarea').val(textareaText + insertText);
}

- ggdx

Answer 3

你可以使用这个：

$(document).ready(function () {
    $('.btn-uservar').on('click', function () {
        $('textarea').append(" ").append($('#uservar').val());
    });
});

- Tbseven