javascript - 在表单提交时重置扩展文本区域的高度

Question

你好，我有这个脚本，它会根据你输入的内容量自动扩展文本区域的高度。

function textAreaAdjust(o) {
  o.style.height = "1px";
  o.style.height = (25+o.scrollHeight)+"px";
}

<textarea onkeyup="textAreaAdjust(this)" style="overflow:hidden"></textarea>

这非常适合根据输入的内容增加/减少高度。但是，我希望它在您点击输入/提交表单后完全重置为默认高度。 (它是一个聊天应用程序)。目前，您必须在提交表单后开始输入新文本，然后它才能识别新的适当高度。 (它是一个 lil 聊天应用程序)

感谢您的帮助!

Answer 1

在您的 JavaScript 中添加一个检查文本区域值的长度，如下所示:

function textAreaAdjust(o) {
  o.style.height = "1px";
  o.style.height = (25+o.scrollHeight)+"px";

  if(o.value.length < 1){
    o.style.height = "30px";
  };

}

这是一个有效的 CodePen