textarea⽂本域的⾼度随内容的变化⽽变化
⽤css控制textarea⽂本域的⾼度随内容的变化⽽变化，不出现滚动条.
CSS代码:
复制代码
代码如下:
.t_area{
width:300px;
overflow-y:visible
}
<textarea class="t_area">js控制滚动条
随便在这⾥输⼊内容,textarea的⾼度会随着你输⼊的内容⽽变化，不会出现滚动条，实现很简单，就是⼀段css:overflow-y:visible
</textarea>
⾸先，原则上实现textarea⾃适应必须适⽤css，不能直接适⽤“width＝100%”这样的写法，具体⽰例：
复制代码
代码如下:
<style>
textarea
{
width:100%;
height:100%;
}
</style>
<textarea name="textarea">
xxxxx
</textarea>
统⼀在FF、IE下的显⽰效果：
如果⽤textarea的属性字数宽度（cols）和⾏数（rows）来控制textarea的⼤⼩你会发现在，在IE和FF下的每⾏字数和⽂字的⾏数都不相同，⽽且在字数不⾜滚动的情况下，IE是默认有滚动条的，⽽FF是没有滚动条的。
那如何控制textarea在IE中和FF中相同的效果呢，其实⽐较简单：
1、⽤textarea的宽度（widht）和⾼度（height）来定义textarea的⼤⼩；
2、让滚动条⾃适应：overflow-y:auto。
IE6中textarea宽度问题
textarea设了100%宽度，在IE7,FIREFOX都正常显⽰.但在IE6⾥只要输⼊⽂字就会⾃动增宽.
解决⽅法：在textarea外再加⼀个100%宽的div.
让⼈抓狂的ie6
overflow的允许属性：auto、visible、hidden
⽰例：
overflow-x:visible;
overflow-y:visible;
⽤js实现版本
<h3>textarea⾃适应⾼度</h3> <textarea style='border: 1px solid #94BBE2;width:100%;' rows=15
onpropertychange='this.style.posHeight=this.scrollHeight' id=textarea
οnfοcus='textarea.style.posHeight=this.scrollHeight'> <Br> </textarea>
提⽰：您可以先修改部分代码再运⾏
css实现版本（不能在标准页⾯中执⾏，已经就是不能加
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd">
）
复制代码
代码如下:
<title>⽂本域⾃适应⾼度</title>
<textarea >在这⾥输⼊⼀些字符看⼀下，当超出初设的⽂本域⾼度时，⽂本域⾃动伸缩变⾼。
另⼀个js版本textarea⾃适应⾼度
项⽬中要求textarea⾃适应⾼度，在⽹上到这个很好的⽅法 。记录下来以后备⽤。
复制代码
代码如下:
function BodyOnLoad()
{
var textarea= ElementById("textarea");
textarea.style.posHeight=textarea.scrollHeight;
}
scrollHeight：获取对象的滚动⾼度。
posHeight：设置或获取以 height 标签属性指定的单位的对象⾼度。
把⽅法加在body的onload事件上
<body onload = "BodyOnLoad();">
综上所述，兼容性什么的⽤css实现的稍微好点，但是⾮标准情况下，才可以。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。