jQuery实现页面中所有的textarea元素高度根据内容自适应
时间: 2023-09-01 14:08:48 浏览: 112
Textarea根据内容自适应高度
可以使用 jQuery 的自适应插件 `autosize` 来实现页面中所有的 textarea 元素高度根据内容自适应。以下是实现的步骤:
1. 引入 jQuery 库和 `autosize` 插件库:
```html
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/autosize.js/4.0.2/autosize.min.js" integrity="sha512-7N2a5lDLbJQcTJ2zuFQI5G0PvT+Q/7zXN3nCfOI8v1Bz+J8Wj9n7ZxI+8P6BDDt5TJY5qOJN6o3N5OoQxVl5wQ==" crossorigin="anonymous"></script>
```
2. 给页面中的所有 textarea 元素添加 `autosize` 类:
```html
<textarea class="autosize"></textarea>
```
3. 在 JavaScript 中初始化 `autosize` 插件:
```javascript
$(function() {
autosize($('.autosize'));
});
```
这样,页面中所有的 textarea 元素就可以根据内容自适应高度了。需要注意的是,当 textarea 元素的内容改变时,插件会自动重新计算其高度。
阅读全文