下面开始写一个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. java设计模式(六)策略模式

    适用于同一操作的不同行为,策略模式定义了一系列的算法,并将每一个算法封装起来,而且使它们可以相互替换,让算法独立于使用它的客户而独立变化,具体应用场景如第三方支付对接不同银行的算法. 要点:1)抽象策 ...

  2. C++反汇编-菱形继承

    学无止尽,积土成山,积水成渊-<C++反汇编与逆向分析技术揭秘> 读书笔记.马上就要出差了,回来后接着写吧. 一.概述 菱形继承是最复杂的对象结构,菱形结构会将单一继承与多重继承进行组合. ...

  3. 详解linux中的ps命令

    Linux中的ps命令是Process Status的缩写.ps命令用来列出系统中当前运行的那些进程.ps命令列出的是当前那些进程的快照,就是执行ps命令的那个时刻的那些进程,如果想要动态的显示进程信 ...

  4. PostgreSQL各命令行工具功能说明

    I. SQL 命令 II. PostgreSQL 客户端应用 clusterdb -- 聚簇一个PostgreSQL数据库 createdb -- 创建一个新的PostgreSQL数据库 create ...

  5. 【windows socket+HTTPserverclient】

    Windows Socket+HTTPserverclient      Winsock是 Windows下套接字标准.                 1.HTTP协议:          HTTP ...

  6. 不使用nib 文件时,需要改变一个view 的大小时,需要为viewcontroller添加loadView方法

    - (void)loadView{ self.view = [[UIView alloc] initWithFrame:[[UIScreen mainScreen] bounds]]; [self.v ...

  7. Unity中关于Device Filter的选择问题

    引言 目前工作的Unity版本是5.4.1f,发布Android版本.apk的时候,对包体的大小有些疑问,就上网查了下资料,发现Build Settings——Player Settings——Oth ...

  8. sqlalchemy批量删除数据、全量删除

    问题:sqlalchemy如何批量删除多条数据解决:使用参数synchronize_session=False,或for循环方法:        users = self.db.query(User) ...

  9. struts 2中为什么抽象包不能包含action?

    struts 2中为什么抽象包不能包含action?麻烦写详细点!

  10. WIDGET和鼠标特效的DEMO

    原创WIDGET和鼠标特效的DEMO, 键盘1 平移Widget键盘2 旋转Widget键盘3 缩放Widget DEMO中,实现对BOX的旋转缩放位移 下载地址: http://pan.baidu. ...