当前位置：文江博客话题详情

如何限制我的文本区域溢出超出某些行？

发布于 2025-01-03 08:27:58 字数 58 浏览 2 评论 0原文

我正在使用文本区域，因为我在增加行数时不需要滚动条。它应该可以调整大小。有没有可能的方法来做到这一点。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

愚人国度 2025-01-10 08:27:58

当用户输入更多文本时，您可以使用 JavaScript 增加 textarea 的高度。

var textarea = document.getElementsByTagName('textarea')[0],
    originalHeight = textarea.clientHeight;

textarea.addEventListener('keyup', function() {
    textarea.style.height = Math.max(textarea.scrollHeight, originalHeight) + 'px';
});

jsFiddle。

它似乎不想用该示例代码来缩小。我认为编写这些控件的大多数人都会生成一个带有 height: auto 的隐藏 div 以及复制的所有字体样式 (font-size, < code>font-family、line-height、letter-spacing 等），然后更新 div 的内部文本与 textarea 的内容。然后，它根据该隐藏元素的高度设置 textarea 的高度。

You can use JavaScript to increase the height of the textarea as the user enters more text.

var textarea = document.getElementsByTagName('textarea')[0],
    originalHeight = textarea.clientHeight;

textarea.addEventListener('keyup', function() {
    textarea.style.height = Math.max(textarea.scrollHeight, originalHeight) + 'px';
});

jsFiddle.

It doesn't seem to want to shrink with that example code. I think most people who write these controls produce a hidden div with height: auto and all the font styles copied over (font-size, font-family, line-height, letter-spacing, etc) and then update the div's inner text with the textarea's contents. It then sets the textarea's height based on the height of this hidden element.