textarea.append() 在手动输入后停止工作答案

【问题标题】：textarea.append() stops working after manually typing in ittextarea.append() 在手动输入后停止工作
【发布时间】：2018-08-09 12:07:26
【问题描述】：

我设法把它缩小到一个非常小的小提琴：

https://jsfiddle.net/wn7aLf3o/4/

基本上，当您单击“附加”时，它应该在文本区域中添加一个“X”。这很好用，直到我决定集中文本区域并手动输入一些东西。那我就不能再追加X了。

在 Chrome 和 Firefox 中测试。我做错了什么？

HTML：

<div id="append">append</div>
<textarea id="text"></textarea>

JQuery:

$(function(){
    $(document).on('click', '#append', function(){
    $('#text').append(" X");
  });
});

【问题讨论】：

How to append text to '<textarea>'?的可能重复

标签： javascript jquery

【解决方案1】：

您需要改用val：

$(function(){
	$(document).on('click', '#append', function(){
  	$('#text').val($('#text').val() + " X");
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="append">append</div>

<textarea id="text"></textarea>

【讨论】：

【解决方案2】：

在https://jsfiddle.net/wn7aLf3o/21/ 更新了小提琴。您不必在 textrarea 中附加元素。 Append 用于添加一个 HTML 元素，但是你想修改 textarea 的文本，所以使用 Val()。

$(function(){
    $(document).on('click', '#append', function(){
    $('#text').val( $('#text').val() + " X") ;
  });
});

【讨论】：