文本框textarea高度随内容自适应增长收缩代码,JS代码库,德仔网

代码语言

代码分类

【JS】文本框textarea高度随内容自适应增长收缩

作者:雨秋 / 发布于2015/9/28/ 588


	<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
	<html xmlns="http://www.w3.org/1999/xhtml" >
	<HTML>
	<HEAD>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<TITLE>枫芸志 &raquo; 文本框textarea高度自适应增长/伸缩</TITLE>
	</HEAD>
	<BODY>
	<textarea id="txtContent" rows="5" cols="50" onkeyup="ResizeTextarea()" style="overflow-y:hidden;">Textarea高度随内容自适应地增长，无滚动条
	晴枫制作
	http://jb51.net</textarea>
	<script type="text/javascript">
	// 最小高度
	var minRows = 5;
	// 最大高度，超过则出现滚动条
	var maxRows = 12;
	function ResizeTextarea(){
	var t = document.getElementById('txtContent');
	if (t.scrollTop == 0) t.scrollTop=1;
	while (t.scrollTop == 0){
	if (t.rows > minRows)
	t.rows--;
	else
	break;
	t.scrollTop = 1;
	if (t.rows < maxRows)
	t.style.overflowY = "hidden";
	if (t.scrollTop > 0){
	t.rows++;
	break;
	}
	}
	while(t.scrollTop > 0){
	if (t.rows < maxRows){
	t.rows++;
	if (t.scrollTop == 0) t.scrollTop=1;
	}
	else{
	t.style.overflowY = "auto";
	break;
	}
	}
	}
	</script>
	</BODY>
	</HTML>

评论列表

本站所提供的代码，版权归原作者所有，若有侵犯作者版权，请与我们联系，我们将立即删除或修改。谢谢!
本站所有代码发布及提供者。

试试其它关键字

　textarea　　自适应增长　

同语言下

可能有用的

雨秋贡献的其它代码(12)