简体繁体 English

调整不可编辑文本区域的大小

[英]Resizing a non-editable textarea

原文 2013-04-29 10:17:13 2 1 javascript/ resize/ textarea

I have two textareas in my web-page. 我的网页上有两个文本区域。 The first one is not-editable (read only) & the one below it is editable. 第一个不可编辑（只读），而其下一个则可编辑。 I want the read-only textarea to adjust its height automatically depending on its content. 我希望只读文本区域根据其内容自动调整其高度。

The content for that textarea comes from a database. 该文本区域的内容来自数据库。 If the content is of one line then the height should adjust & if it is of multiple lines then the height should adjust accordingly. 如果内容为一行，则高度应调整；如果内容为多行，则高度应相应调整。

How can I achieve this ?? 我该如何实现？ I want JavaScript & no JQuery. 我想要JavaScript而不要使用JQuery。

1 个解决方案

I just googled to check for existing solutions and http://www.impressivewebs.com/textarea-auto-resize/ looks decent. 我只是用谷歌搜索现有的解决方案，并且http://www.impressivewebs.com/textarea-auto-resize/看起来不错。 The idea is to create hidden div which will let you measure the height of text input in your textarea. 这个想法是创建隐藏的div ，它可以让您测量文本区域中文本输入的高度。 Remeber to have the same font styling in both the textarea and the div. 记住在textarea和div中使用相同的字体样式。 With this in mind you can either translate that few lines of jquery into pure js or write it by yourself using this idea. 考虑到这一点，您既可以将几行jquery转换为纯js，也可以使用此想法自己编写。