我想知道用户是否移动到了新行而没有按下textarea元素中的输入按钮

Question

当用户在textarea中写入任何内容时，当按下Enter按钮移动到新行时，会创建一个字符'\n'。

如果用户继续写下来，直到他到达行末，然后在没有按下回车按钮的情况下自动转入新行，那么我该如何知道这一点呢？

下面的代码会增加textarea的时候按下回车键，我想在做同样的行为时，自动打开到一个新的行不按回车键：

var textarea = document.getElementById('text'); 
 
textarea.onkeyup = function (eve) { 
 
    if (eve.keyCode == 13) { // 13 = enter key 
 
     textarea.style.height = textarea.offsetHeight + 25 + 'px'; 
 
    } 
 
};

#text {width:300px;}

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

Answer 1

有多个库可以为你做到这一点。例如。

http://www.jacklmoore.com/autosize/

https://alexdunphy.github.io/flexText/

编辑：

当你不想直接使用库，我检查the code of the jacklmoores autosize。

它的功能基本上是将高度设置为自动，然后使用滚动高度作为textarea的高度。我还将onkeyup更改为onkeydown，以便在按住某个键时调整其大小。

var textarea = document.getElementById('text'); 
textarea.onkeydown = function (eve) { 
    textarea.style.height = 'auto' 
    textarea.style.height = textarea.scrollHeight+'px'; 
} 

JSFiddle

Answer 2

var textarea = document.getElementById('text'); 
 
textarea.onkeyup = function (eve) { 
 
    if (eve.keyCode == 13) { // 13 = enter key 
 
     textarea.style.height = textarea.offsetHeight + 25 + 'px'; 
 
    } 
 
};

#text {width:300px;}

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