我想知道用户是否移动到新行 没有按文本区域元素中的输入按钮



当用户在文本区域中写入任何内容时,当按 Enter 按钮移动到新行时,会创建一个'n'字符。

如果用户继续写到行尾,然后在不按回车按钮的情况下自动切换到新行怎么办,在这种情况下,我怎么知道呢?

以下代码将在按回车按钮时

增加文本区域,我想在不按回车按钮的情况下自动转到新行时做同样的行为:

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>

有多个库可以为您执行此操作。 例如

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

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

编辑:

由于您不想直接使用该库,因此我检查了jacklmoores自动调整大小的代码。

它的作用基本上是将高度设置为自动,然后使用滚动高度作为文本区域的高度。我还将您的 onkeyup 更改为 onkeydown,以便在按住键时调整大小。

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

JSFiddle

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>

最新更新