您的位置:首页 > 其它

让文本框textarea自动适应内容的高度

2009-10-14 17:35 609 查看
CSS写法:overflow-y:visible

<textarea style="width:300px;overflow-y:visible">

输入你的内容来这里看看,,

这个文本框能自动适应你的内容多少,

自动伸缩高度

</textarea>

本代码适用平台:IE6,IE7

为了兼容FF 3.0

function getEvent() //同时兼容ie和ff的写法
{
if(document.all)   return window.event;
func=getEvent.caller;
while(func!=null){
var arg0=func.arguments[0];
if(arg0)
{
if((arg0.constructor==Event || arg0.constructor ==MouseEvent) || (typeof(arg0)=="object" && arg0.preventDefault && arg0.stopPropagation))
{
return arg0;
}
}
func=func.caller;
}
return null;
}

function addRowNum(textareaObj){
if(textareaObj == null) return;
var e = getEvent();
if(e.keyCode==13){//回车建
var orows = textareaObj.rows;
//alert(orows);
if(orows < 0){   //未设置rows
//alert(textareaObj.value);
var lines = textareaObj.value.split("/n");
//alert(lines.length);
textareaObj.rows = lines + 2;
}
else{
//alert(orows);
if(orows == 0) orows = 2;
textareaObj.rows = orows + 1;
}
}
}


<textarea style="width:300px;overflow-y:visible" onkeydown='addRowNum(this)'>
输入你的内容来这里,看看这个文本框能自动适应你的内容多少,
看俺



暂时只能支持按回车的情况, 如果是一行很长, 还没办法处理
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: