Question

我创建了一个简单的html文件，可以自动调整文本区域的大小。

该脚本运行正常（几乎）。

我面临的唯一问题是，当按下[enter]键时，只有在下一次按键后才对齐文本区域，因此，在按下[enter]键时，所有内容都无法对齐。仅在下一次按键后才能对齐。

这是我的简单代码：

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Gangina Auto Resize</title>
<style>
 textarea
  {
    display:block;
    resize:none;
    overflow:hidden;
  }
</style>    
</head>
<body>
<textarea id="txtArea" onkeypress="onTestChange();"></textarea>
<script>
function onTestChange()
  {
    var ta = document.getElementById("txtArea");
    ta.style.height = ta.scrollHeight + 'px';
  }
</script>   
</body>
</html>

我试图在公式中添加伪造的\n，但未按预期运行。

Answer 1

您似乎需要keyup

function onTestChange() {
  var ta = document.getElementById("txtArea");
  ta.style.height = ta.scrollHeight + 'px'
}

<textarea id="txtArea" onkeyup="onTestChange();"></textarea>

自动调整文本区域的大小

1 个答案: