Javascript 如果textarea中有新行，则添加1行并增加textarea的大小

创建了一个表单，允许文本区域中的占位符在单击时向上移动， 试图使文本区域的高度每换行增加1行，但在我的javascript函数中，我不太确定在if语句中包含什么来检查是否有换行：

//函数SetNewSize（textarea）{
//如果（textarea.value.length>106）{
//textarea.cols+=1；
//textarea.rows+=1；
//}其他{
//textarea.cols=2；
//textarea.rows=2；
//    }
//}
函数SetNewSize（textarea）{
如果（textarea.rows>1）{
textarea.rows+=1；
}否则{
textarea.rows=2；
}
}

*，
*：之前，
*：之后{
框大小：边框框；
}
身体{
宽度：100%；
最小高度：300px；
}
形式{
宽度：600px；
利润率：2米自动；
字体系列：“源Sans-Pro”，无衬线；
字体大小：300；
字体大小：22px；
}
表格图例{
字号：2em；
边缘底部：1米；
宽度：100%；
边框底部：1px实心#ddd；
}
.浮动标签。控件{
浮动：左；
位置：相对位置；
宽度：100%；
边框底部：1px实心#ddd；
填充顶部：23px；
垫底：10px；
}
.浮动标签。控制。小{
宽度：30%；
右边框：1px实心#ddd；
}
.浮动标签.控件.介质{
宽度：70%；
左侧填充：10px；
}
.浮动标签.控件：最后一个子项{
边界：0；
}
.浮动标签输入，
.浮动标签文本区域{
显示：块；
宽度：100%；
边界：0；
大纲：0；
调整大小：无；
}
.浮动标签输入+标签，
.浮动标签文本区域+标签{
位置：绝对位置；
顶部：10px；
过渡：顶部0.7s缓和，不透明度0.7s缓和；
不透明度：0；
字体大小：13px；
字号：600；
颜色：#ccc；
}
.浮动标签输入：有效+标签，
.浮动标签文本区域：有效+标签{
不透明度：1；
顶部：3px；
}
.浮动标签输入：焦点+标签，
.浮动标签文本区域：焦点+标签{
颜色：2c8efe；
}

浮动标签演示
标题
价格
描述

您只需使用

拆分

，并在

\n

上拆分，即可计算换行符

另外，要停止滚动条闪烁，只需将

overflow-y:hidden

放在文本区域中，就可以看到它们正在使滚动条变大

编辑：好的，另一个想法。。我们可以从

textarea.scrollHeight

获得所需的高度，而不是改变行，只需改变元素的高度即可

例如

函数SetNewSize（textarea）{
textarea.style.height=“0px”；
textarea.style.height=textarea.scrollHeight+“px”；
}

*，
*：之前，
*：之后{
框大小：边框框；
}
身体{
宽度：100%；
最小高度：300px；
}
形式{
宽度：600px；
利润率：2米自动；
字体系列：“源Sans-Pro”，无衬线；
字体大小：300；
字体大小：22px；
}
表格图例{
字号：2em；
边缘底部：1米；
宽度：100%；
边框底部：1px实心#ddd；
}
.浮动标签。控件{
浮动：左；
位置：相对位置；
宽度：100%；
边框底部：1px实心#ddd；
填充顶部：23px；
垫底：10px；
}
.浮动标签。控制。小{
宽度：30%；
右边框：1px实心#ddd；
}
.浮动标签.控件.介质{
宽度：70%；
左侧填充：10px；
}
.浮动标签.控件：最后一个子项{
边界：0；
}
.浮动标签输入，
.浮动标签文本区域{
显示：块；
宽度：100%；
边界：0；
大纲：0；
调整大小：无；
}
.浮动标签输入+标签，
.浮动标签文本区域+标签{
位置：绝对位置；
顶部：10px；
过渡：顶部0.7s缓和，不透明度0.7s缓和；
不透明度：0；
字体大小：13px；
字号：600；
颜色：#ccc；
}
.浮动标签输入：有效+标签，
.浮动标签文本区域：有效+标签{
不透明度：1；
顶部：3px；
}
.浮动标签输入：焦点+标签，
.浮动标签文本区域：焦点+标签{
颜色：2c8efe；
}
文本区{
溢出y：隐藏；
}

浮动标签演示
标题
价格
描述

您不能计算换行符，因为如果文本太长，textareas将换行，创建一个没有

\n

字符的换行符

这样做可以用于第一个div

您只将键放在第一个div上，。。我将为大家修改代码片段。谢谢大家的帮助！你好，对不起！有没有办法在删除行时也减小文本区域的大小？@lanes123我已经更新来处理这个问题，基本上只需在重置高度之前将高度设置为0，以便重新计算scrollHeight。