下面开始写一个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. python开发_HTMLParser_html文档解析

    ''' 在HTMLParser类中,定义了很多的方法,但是很多方法都是没有实现的, 这需要我们继承HTMLParser类,自己去实现一些方法 如: # Overridable -- handle st ...

  2. C#高级编程9-目录

    C#高级编程 ===================================================== .NET体系结构 核心C# 对象与类型 继承 泛型 数组 运算符和类型强制转换 ...

  3. python知识(3)----正则表达式

    python的正则表达式使用起来非常的方便,基本思路就是编译规则,匹配字符串,输出字符串 参考资料 Python中的正则表达式教程

  4. Easy WordPress Updates: Store FTP Info in wp-config.php

    Saw an interesting blog post on Twitter today about storing WordPress FTP information in wp-config.p ...

  5. BTSync 2.0 Vs. 1.4 Folders

    Sync 2.0 supports boths new 2.0 folders and classic 1.4 folders, s o when you upgrade your Sync it w ...

  6. eclipse鼠标变成十字架

    不知道按到什么或者点到什么button了,在eclipse里面鼠标就变成了十字架形式.解决的方法是按:alt+shift+a 原来alt+shift+a是框选代码的.长见识了!

  7. Leptonica在VS2010中的编译及简单使用举例

    在tesseract-ocr中会用到leptonica库.这里对leptonica简介下. Leptonica是一个开源的图像处理和图像分析库,它的license是BSD 2-clause.它主要包括 ...

  8. 我对NHibernate的感受(3):有些尴尬的集合支持

    既然是一个ORM框架,那么自然是将O这一端映射R上.至于集合,是O这方面最常见,也是R这一边非常容易表示的关系.例如,一个问题(Question)可以包含多个回答(Answer),于是我的代码里就有这 ...

  9. matlab快捷键大全

    原文地址,点此查看 一.常用对象操作 除了一般windows窗口的常用功能键外. 1.!dir 可以查看当前工作目录的文件. !dir& 可以在dos状态下查看. 2.who   可以查看当前 ...

  10. RocketMQ的部署方式及持久化方式

    RocketMQ 的 Broker 有三种集群部署方式: 1. 单台 Master 部署: 2. 多台 Master部署: 3. 多 Master 多 Slave 部署:采用第 3 种部署方式时, M ...