文档章节

5分钟实现多行文本框[textarea]自动高度jquery 插件

党程V
 党程V
发布于 2015/03/03 11:01
字数 282
阅读 287
收藏 3

因为此代码应用中发现在连续回车或者退格的情况下有bug,所以重新写了做了调整,参照新文

[1分钟实现多行文本框[textarea]自动高度jquery 插件]

####################################################

##############以下内容为旧文不建议参考#######################

####################################################



<div class="form-group">
	<label class="col-sm-3 control-label no-padding-right" for="form-field-5"> 内容</label>
	<div class="col-sm-9">
		<textarea class="col-sm-8" id="form-field-5" placeholder="请输入内容..."></textarea>
	</div>
</div>
jQuery.extend({
	textareaAutosize_dc: function() {
		$("textarea").on("keyup", function(e) {
			var currentEnterCount = $(this).val().split("\n").length;
			var lineHeight = Number($(this).css("line-height").replace("px", ""));

			var enterCount = $(this).attr("enterCount");
			if (currentEnterCount < enterCount && enterCount != undefined) {
				//每行减掉固定行高
				$(this).height($(this).height() - lineHeight);
			} else if (currentEnterCount > enterCount) {
				//每行加入固定行高
				$(this).height($(this).height() + lineHeight);
				$(this).attr("enterCount", currentEnterCount);
			}
			//记录当前行高
			$(this).attr("enterCount", currentEnterCount);
		});
	}
});
//调用自动高度
$.textareaAutosize_dc();


© 著作权归作者所有

党程V
粉丝 5
博文 20
码字总数 9126
作品 0
西安
高级程序员
私信 提问
jQuery对表单、表格的操作及更多的应用

jQuery对表单、表格的操作及更多的应用 1 表单应用 一个表单有3个基本组成部分。 (1) 表单标签:包含处理表单数据所用的服务器端应用程序URL以及数据提交到服务器的方法 (2) 表单域:包含文本...

zhangda89
2011/10/07
432
0
12 个必要的 jQuery 表单插件

Web表单是网站中很常见的Web组件,你用它来收集数据,用户的详细信息等。然而,现有的表单限制很多,功能比较简单,尽管有 HTML5 ,不幸的是,并非所有浏览器都支持它,所以现在我们可以使用...

红薯
2012/03/28
5.8K
8
Web 开发中 9 个有用的提示和技巧

在本文中,我们给出 9 个有用的 HTML、CSS 和 JavaScript 的技巧和提示,可能在做 Web 开发中经常会需要用到的,其中有几个是关于 HTML5 和 CSS3 的,如果你是一个前端开发者,那么或许对你有...

彭博
2012/11/27
301
0
Web 开发中 9 个有用的提示和技巧

在本文中,我们给出 9 个有用的 HTML、CSS 和 JavaScript 的技巧和提示,可能在做 Web 开发中经常会需要用到的,其中有几个是关于 HTML5 和 CSS3 的,如果你是一个前端开发者,那么或许对你有...

小编辑
2012/06/05
5.5K
17
15 个非常有用的 jQuery 表单插件

有很多 jQuery 的表单插件。这里收集了其中15个是最有用的插件。 ALAJAX (Ajaxify your HTML form) 该插件可轻松将你的表单变成 Ajax 方式处理,阻止了提交动作,然后通过 Ajax 方式提交。 ...

oschina
2012/12/04
6.1K
13

没有更多内容

加载失败,请刷新页面

加载更多

Spring使用ThreadPoolTaskExecutor自定义线程池及实现异步调用

多线程一直是工作或面试过程中的高频知识点,今天给大家分享一下使用 ThreadPoolTaskExecutor 来自定义线程池和实现异步调用多线程。 一、ThreadPoolTaskExecutor 本文采用 Executors 的工厂...

CREATE_17
今天
5
0
CSS盒子模型

CSS盒子模型 组成: content --> padding --> border --> margin 像现实生活中的快递: 物品 --> 填充物 --> 包装盒 --> 盒子与盒子之间的间距 content :width、height组成的 内容区域 padd......

studywin
今天
7
0
修复Win10下开始菜单、设置等系统软件无法打开的问题

因为各种各样的原因导致系统文件丢失、损坏、被修改,而造成win10的开始菜单、设置等系统软件无法打开的情况,可以尝试如下方法解决 此方法只在部分情况下有效,但值得一试 用Windows键+R打开...

locbytes
昨天
8
0
jquery 添加和删除节点

本文转载于:专业的前端网站➺jquery 添加和删除节点 // 增加一个三和一节点function addPanel() { // var newPanel = $('.my-panel').clone(true) var newPanel = $(".triple-panel-con......

前端老手
昨天
8
0
一、Django基础

一、web框架分类和wsgiref模块使用介绍 web框架的本质 socket服务端 与 浏览器的通信 socket服务端功能划分: 负责与浏览器收发消息(socket通信) --> wsgiref/uWsgi/gunicorn... 根据用户访问...

ZeroBit
昨天
10
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部