如何使用 jquery 清除文本区域

【问题标题】：How do I clear a textarea with jquery如何使用 jquery 清除文本区域
【发布时间】：2016-08-16 20:43:17
【问题描述】：

这个问题已经回答了，但是为了将来参考这里是一个完整的例子。

您可以根据需要多次单击添加按钮和清除按钮，它会起作用。但是一旦你在文本框中输入了一些东西，那么清除和添加按钮就不起作用了。

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
$(document).ready(function(){

    $("#add").click(function(){

        $("#box").append("Test, ")
    });

    $("#clean").click(function(){
        $("#box").text("")
    });

});
</script>
</head>
<body>

<button id="add">ADD</button><br/>
<textarea rows="10" cols="50" id="box"></textarea><br/>
<button id="clean">Clear Box</button>

</body>
</html>

【问题讨论】：

尝试使用 $("#textarea").val('');
请发minimal reproducible example 说明问题
对于那些对事件处理程序有问题的人，这里是一个解决方法答案。 stackoverflow.com/questions/8284960/clear-text-area/…

标签： jquery html textarea

【解决方案1】：

在处理需要用户输入的元素时，您应该使用 jQuery 的 val 函数：

$(function() {
  $('#b1').click(function() {
      $("#textarea").val($("#textarea").val() + "This is a test");
  });
  $('#c1').click(function() {
    $("#textarea").val("")
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea id="textarea"></textarea><br />
<button id="b1">Append</button> <button id="c1">Clear</button>

append 函数更改了DOM，这不是您要在此处执行的操作（这会破坏textarea 元素的默认行为）。

【讨论】：

非常感谢。这个问题快把我逼疯了。