单击按钮将元素添加到textarea

Question

我想在用户点击按钮时向textarea添加文本。我用下面的代码：

<script>
  document.addEventListener('DOMContentLoaded', start, false);
  function start(){
    document.getElementById("button0").addEventListener("click", function(){
      addText(this);
    });
    function addText(elem) {
      document.getElementById("transcript").innerHTML += elem.value;
    }
  };
</script>

当用户单击按钮时，文本会添加到textarea，但是当他们使用键盘输入时，他们将无法再使用按钮添加文本。

Answer 1

使用.value而不是.innerHTML。

.innerHTML会覆盖元素的标记，而不仅仅是文本。因为它是一个表单元素，所以你应该只操纵它的值。

document.getElementById("button0").addEventListener("click", function() {
document.getElementById("transcript").value += "huh";
});

#transcript {
height: 100px;
}

<button id="button0">Click Me</button>

<textarea id="transcript"></textarea>