<head>
<title></title>
<style type="text/css">
.txt
{
border: 1px solid #CCC;
200px;
padding: 3px;
font: 12px/16px Simsun;
outline: none;
resize: none;
word-wrap: break-word;
word-break: break-all;
overflow: hidden;
}
</style>
</head>
<body>
<textarea id="o" class="txt">自适应高度</textarea>
<script type="text/javascript">
(function (o, e, t) {
//创建一个pre标签,用来计算文字应有高度
e = document.createElement("pre");
//给pre添加上和文本域一样的样式
e.className = "txt";
//设置绝对定位到屏幕外来隐藏它
e.style.position = "absolute";
e.style.left = "-9999px";
//创建一个文本节点来操作,避免直接操作HTML
e.appendChild(t = document.createTextNode(""));
//给pre的末尾添加一个换行,因为pre会吞掉末尾的一个换行
e.appendChild(document.createTextNode("
"));
//把pre放入文档中
document.body.appendChild(e);
//文本域键盘事件时计算高度
o.onkeydown = o.onkeyup = function () {
//IE8下
在PRE标签中会被解析为两行,所以需要一个替换
//如果觉得这样会影响效率可以先判断浏览器
t.data = o.value.replace(/
/g, "
");
o.style.height = e.offsetHeight - 8 + "px";
};
//初始时计算一次
o.onkeydown();
//为了避免换行时闪的太厉害,稍微阻止下滚动
o.onscroll = function () { o.scrollTop = 0 };
})(document.getElementById("o"));
</script>
</body>


参考文章:http://www.web-tinker.com/search/JavaScript%20%E6%B6%88%E6%81%AF%E6%9C%BA%E5%88%B6/2.html