有時(shí)候我們需要textarea的高度隨著內(nèi)容的多少去自適應(yīng)的變化，今天我使用了JS原生和JQ寫了一個(gè)textarea的高度隨著他的內(nèi)容高度變化的代碼，希望能幫上忙。

廢話不多說直接貼代碼：

textarea{ width:500px; margin:20px auto; padding:0; font-size:14px; color:#333; font-family:"Microsoft YaHei"; line-height:28px;}

CGLweb前端 http://cenggel.com/

青格勒前端博客 http://cenggel.com/

CGLweb前端 http://cenggel.com/

青格勒前端博客 http://cenggel.com/

$(document).ready(function () {

var text_box = $('#textarea');

function cglHeight() {

var cglTextHeight = text_box.get(0).scrollHeight;

text_box.css('height',cglTextHeight+'px');

console.log(cglTextHeight);

};

cglHeight();

text_box.on('keyup mousedown mouseup focus blur',function(){

cglHeight();

});

});

在線演示

如果對你有幫助，別了分享哦。

總結(jié)

以上是生活随笔為你收集整理的html文本域 高度自适应,textarea高度自适应，textarea随着内容高度变化的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。