textarea内容高度自适应

最新推荐文章于 2025-06-30 10:12:51 发布

songywaa

最新推荐文章于 2025-06-30 10:12:51 发布

阅读量513

点赞数 2

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_42288182/article/details/88872471

本文介绍如何使textarea组件的高度根据内容自动调整。默认情况下，不同浏览器显示的行数可能不一致，如谷歌、IE和Opera默认显示两行，而火狐则默认显示三行。通过使用jQuery代码，可以实现textarea内容高度的自适应。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

textarea内容高度自适应

// textarea中添加一些内容
<textarea name="text" style="width: 300px;">textarea是一个文本框，谷歌、IE、Opera默认显示两行文本，火狐默认显示3行文本，行数超过两行是会出现滚动条，可以自己设定设定一些行数来进行强制多少行进行显示。textarea是一个文本框，谷歌、IE、Opera默认显示两行文本，火狐默认显示3行文本，行数超过两行是会出现滚动条，可以自己设定设定一些行数来进行强制多少行进行显示。textarea是一个文本框，谷歌、IE、Opera默认显示两行文本，火狐默认显示3行文本，行数超过两行是会出现滚动条，可以自己设定设定一些行数来进行强制多少行进行显示。textarea是一个文本框，谷歌、IE、Opera默认显示两行文本，火狐默认显示3行文本，行数超过两行是会出现滚动条，可以自己设定设定一些行数来进行强制多少行进行显示。</textarea>

<script>
$.each($("textarea"), function(i, n){
    $(n).css("height", n.scrollHeight + "px");
})
</script>