根据内容自动调整文本区域的大小 [英] Automatically resize text area based on content

问题描述

在我的一个页面上，我有一个文本区域html标签供用户写入一个字母。我想让文本区域下面的内容向下移动，或者换句话说，我想让文本区域垂直调整每行添加到文本区域，并使下面的内容简单地相对于文本区域的底部定位。

On one of my pages, I have a text area html tag for users to write a letter in. I want the content below the text area to shift down, or in other words, I want the text area to resize vertically with each line added to the text area and to have the content below simply be positioned in relation to the bottom of the text area.

我希望的是javascript / jquery有一种方法来检测单词换行的时间，或者当添加一个新行并且基于它做文本区域容器的大小调整。

What I am hoping is that javascript/jquery has a way to detect when the words wrap, or when a new line is added and based on that do a resize of the text area container.

我的目标是让

当文本溢出时，文本区域将创建一个滚动条，文本区域下方的内容与文本底部保持相同的距离。

The text area creates a scroll bar when the text overflows.

推荐答案

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

首先下载插件：

步骤1：将jquery.autoresize.min.js放在您保存jquery插件的位置。

Step 1: Put "jquery.autoresize.min.js" where you keep your jquery plugins.

步骤2：将文件链接到HTML - > < script src =jquery.autosize.min.jstype =text / javascript>< / script> 请确保此链接在您的jquery链接之后，

Step 2: Link the file in HTML -> <script src="jquery.autosize.min.js" type="text/javascript" ></script> Be sure that this link comes after your jquery link, and before your own javascript/jquery code links.

步骤3：在您的javascript代码文件中，只需添加 $（'＃containerToBeResized'）。autosize ;

Step 3: In your javascript code file simply add $('#containerToBeResized').autosize();

这篇关于根据内容自动调整文本区域的大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！