textarea如何自适应高度
Textarea自适应高度可以通过以下两种方法实现:
- 使用JavaScript
可以使用JavaScript来实现Textarea自适应高度,代码如下:
function autoTextarea(element) {
element.style.height = "auto";
element.style.height = element.scrollHeight + "px";
}
在Textarea标签上添加oninput事件,调用autoTextarea函数即可实现自适应高度:
<textarea oninput="autoTextarea(this)"></textarea>
- 使用CSS
也可以使用CSS来实现Textarea自适应高度,代码如下:
textarea {
height: auto;
resize: none; /* 去掉Textarea的拖拽功能 */
}
textarea:focus {
outline: none; /* 去掉Textarea的聚焦时的边框 */
}
Textarea的高度设置为auto,同时去掉Textarea的拖拽功能,聚焦时去掉边框即可实现自适应高度。需要注意的是,在某些浏览器中,Textarea的高度可能不会自适应,此时需要使用JavaScript来实现自适应高度。
原文地址: http://www.cveoy.top/t/topic/GBQ 著作权归作者所有。请勿转载和采集!