下面开始写一个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. 命令神器:lsof 常用

    lsof -i 显示所有网络连接lsof -i 6 获取IPv6信息lsof -itcp 显示tcp连接lsof -i:80 显示指定端口信息lsof -i@172.12.5.6 显示指定ip连接ls ...

  2. java设计模式(五)责任链模式

    很多对象有每个对象对其下家的引用而连接起来形成一条链,请求在这条链上传递,直到链上某个对象决定处理此请求,应用场景如单位审批流程等. 要点:1)抽象处理者角色:定义处理请求接口及设定下家引用    2 ...

  3. 属性通知之ObservableCollection

    单个属性是如何去通知,在上一章已经介绍过了,那么集合如何做到属性通知呢?这里要介绍ObservableCollection<T>,字面意思就是用于观察的集合. msdn上给出的定义是:表示 ...

  4. SQL Server中执行正则表达式

    总体方案:写function,再执行update语句. 一.查询函数 -- ============================================= -- Author: <l ...

  5. Trie树 理解

    Trie树的理解 Trie树又称单词查找树,字典树,是哈希树的变种: 优点在于:最大限度地减少无谓的字符串比较,查询效率比哈希高: 缺点在于:空间消耗很大: 性质 其基本性质可以归纳为: 跟结点不包括 ...

  6. IOS学习笔记41--图片的缩放(一)

    图片的缩放 一:Pinch手势对图片进行缩放.即用两根手指往不同方向拖拉照片,照片会被缩小或放大. 我理解的原理:等比缩放 先看如下关键代码: 1.初始化参数 - (void)viewDidLoad ...

  7. Eclipse批量替换

    情景: 我需要将项目中所有有"上样板"的字样替换为"PCR板",如果寻找单个页面肯定是很麻烦,而且替换很有可能不全,那么该怎么才能完全替换呢? 解决方法: ec ...

  8. Kafka开发环境搭建(五)

    如果你要利用代码来跑kafka的应用,那你最好先把官网给出的example先在单机环境和分布式环境下跑通,然后再逐步将原有的consumer.producer和broker替换成自己写的代码.所以在阅 ...

  9. RecyclerView 缓存机制详解

    一 前言 RecyclerView据官方的介绍,该控件用于在有限的窗口中展示大量数据集,其实这样功能的控件我们并不陌生,例如:ListView.GridView.RecyclerView可以用来代替传 ...

  10. 读书笔记之:C语言深度剖析

    读书笔记之:C语言深度剖析 <C 语言深度解剖>这本书是一本“解开程序员面试笔试的秘密”的好书.作者陈正冲老师提出“以含金量勇敢挑战国内外同类书籍”,确实,这本书中的知识点都是一些在面试中 ...