下面开始写一个jquery插件

(function($){
$.fn.autoTextarea = function(options) {
var defaults={
maxHeight:null,//文本框是否自动撑高,默认:null,不自动撑高;如果自动撑高必须输入数值,该值作为文本框自动撑高的最大高度
minHeight:$(this).height()
};
var opts = $.extend({},defaults,options);
return $(this).each(function() {
$(this).bind("paste cut keydown keyup focus blur",function(){
var height,style=this.style;
this.style.height = opts.minHeight + 'px';
if (this.scrollHeight > opts.minHeight) {
if (opts.maxHeight && this.scrollHeight > opts.maxHeight) {
height = opts.maxHeight;
style.overflowY = 'scroll';
} else {
height = this.scrollHeight;
style.overflowY = 'hidden';
}
style.height = height + 'px';
}
});
});
};
})(jQuery);

调用代码示例:

<textarea name="textarea" id="textarea" cols="60" rows="4" class="chackTextarea-area"></textarea>
<script type="text/javascript"> $(".chackTextarea-area").autoTextarea({
maxHeight: 220,//文本框是否自动撑高,默认:null,不自动撑高;如果自动撑高必须输入数值,该值作为文本框自动撑高的最大高度
});

技术交流QQ群:15129679

jquery文字填写自动高度的更多相关文章

  1. jquery 文字滚动大全 scroll 支持文字或图片 单行滚动 多行滚动 带按钮控制滚动

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. jquery文字上下滚动--单行 批量多行 文字图片上下翻滚 | 多行滚动

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. JS实现页面复制文字时自动加版权

    经亲自实践,尝试了各种方法,目前可行的方法主要有如下两种: 可以在任何运行使用js代码的网站中使用,比如本人在自己的博客园博客中实现了一下,读者您可亲自在本人博客上测试. 方法1: <scrip ...

  4. javascript 文字大小自动适应文本框 (文字大小自动调整)

    javascript 文字大小自动适应文本框 (文字大小自动调整) TOC 思考 思考一:面积法 思考二:微调法 代码 在进行类似微博墙之类的展示页面中,经常会遇到这样的需求:在固定大小的区域放入字数 ...

  5. jquery叠加页片自动切换特效

    查看效果:http://keleyi.com/keleyi/phtml/jqtexiao/34.htm 下面是HTML代码: <!DOCTYPE html> <html xmlns= ...

  6. iframe自动高度

    <script> //设置iframe自动高度 function setIframe(id){ var fn = function(){ try{ var iframe = typeof ...

  7. jQuery UI Autocomplete是jQuery UI的自动完成组件(share)

    官网:http://jqueryui.com/autocomplete/ 以下分享自:http://www.cnblogs.com/yuzhongwusan/archive/2012/06/04/25 ...

  8. jquery获取文档高度和窗口高度的例子

    jquery获取文档高度和窗口高度,$(document).height().$(window).height() $(document).height():整个网页的文档高度 $(window).h ...

  9. jquery文字左右滚动

    实现jquery文字左右滚动 <div class="fl">中奖名单:</div> <div class="scrollText" ...

随机推荐

  1. Spring之Spring环境搭建

    Spring之Spring环境搭建 一.什么是Spring? Spring框架是由于软件开发的复杂性而创建的.Spring使用的是基本的JavaBean来完成以前只可能由EJB完成的事情.然而,Spr ...

  2. Struts2 (中)

    Struts中API介绍 ServletAPI 在使用Struts2的框架的过程中,发现Struts2和Servlet的API是解耦合的. 在实际开发中,经常使用到Servlet的API,比如进行登录 ...

  3. CentOS---网络配置详解

    一.配置文件详解 在RHEL或者CentOS等Redhat系的Linux系统里,跟网络有关的主要设置文件如下: /etc/host.conf         配置域名服务客户端的控制文件 /etc/h ...

  4. hdu 5288 OO’s Sequence(2015多校第一场第1题)枚举因子

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=5288 题意:在闭区间[l,r]内有一个数a[i],a[i]不能整除 除去自身以外的其他的数,f(l,r ...

  5. Codeforces Round #196 (Div. 2) A. Puzzles 水题

    A. Puzzles Time Limit: 2 Sec  Memory Limit: 60 MB 题目连接 http://acm.zju.edu.cn/onlinejudge/showProblem ...

  6. [分享]2013:Linux的黄金之年-十大杰出成就

    2013年已经过去.这一年见证了许多里程碑事件,使得2013年可以称得上是一个Linux的黄金之年.其中一些成果在FOSS和Linux世界更可以称得上是举世瞩目的成就. 1.Android的上升趋势 ...

  7. centos 6.5安装VMware tools

    系统描述:win7旗舰版64位系统+VMware Workstation10+CentOS6.5(win7系统上安装了VMware Workstation10虚拟化软件,在该虚拟化软件上安装了Cent ...

  8. maven进阶:一个多模块项目

    一个多模块项目通过一个父POM 引用一个或多个子模块来定义.父项目,通过以下配置,将子项目关联. <packaging>pom</packaging> <modules& ...

  9. Html基本操作实例代码

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD ...

  10. ARC 特性

    ResultVC *myResultVC = [[ResultVC alloc]initWithNibName:@"ResultVC" bundle:nil]; [self.vie ...