jquery实现textarea 高度自适应


Posted in Javascript onMarch 11, 2015

之前给大家分享过用Javascript控制文本框textarea高度随内容自适应增长收缩,今天花了点时间换了种实现方法,总结一下

jQuery.fn.extend({

            autoHeight: function(){

                return this.each(function(){

                    var $this = jQuery(this);

                    if( !$this.attr('_initAdjustHeight') ){

                        $this.attr('_initAdjustHeight', $this.outerHeight());

                    }

                    _adjustH(this).on('input', function(){

                        _adjustH(this);

                    });

                });

                /**

                 * 重置高度 

                 * @param {Object} elem

                 */

                function _adjustH(elem){

                    var $obj = jQuery(elem);

                    return $obj.css({height: $obj.attr('_initAdjustHeight'), 'overflow-y': 'hidden'})

                            .height( elem.scrollHeight );

                }

            }

        });

        // 使用

        $(function(){

            $('textarea').autoHeight();

        });

以上就是本文所述的全部内容了,希望对大家学习jQuery能够有所帮助。

Javascript 相关文章推荐
PJBlog插件 防刷新的在线播放器
Oct 25 Javascript
JQuery live函数
Dec 24 Javascript
jquery 实现二级/三级/多级联动菜单的思路及代码
Apr 08 Javascript
JavaScript中window、doucment、body的解释
Aug 14 Javascript
JScript分割字符串示例代码
Sep 04 Javascript
超赞的动手创建JavaScript框架的详细教程
Jun 30 Javascript
详解JavaScript时间处理之几个月前或几个月后的指定日期
Dec 21 Javascript
three.js实现围绕某物体旋转
Jan 25 Javascript
详解vue-cli项目中的proxyTable跨域问题小结
Feb 09 Javascript
vue项目tween方法实现返回顶部的示例代码
Mar 02 Javascript
微信小程序通过js实现瀑布流布局详解
Aug 28 Javascript
jQuery实现的解析本地 XML 文档操作示例
Apr 30 jQuery
jQuery简单实现禁用右键菜单
Mar 10 #Javascript
jQuery判断数组是否包含了指定的元素
Mar 10 #Javascript
js控制文本框只输入数字和小数点的方法
Mar 10 #Javascript
jQuery实现当前页面标签高亮显示的方法
Mar 10 #Javascript
jQuery简单几行代码实现tab切换
Mar 10 #Javascript
jQuery实现高亮显示的方法
Mar 10 #Javascript
jQuery实现切换字体大小的方法
Mar 10 #Javascript
You might like
PHP多线程批量采集下载美女图片的实现代码(续)
2013/06/03 PHP
PHP中单引号与双引号的区别分析
2014/08/19 PHP
PHP实现上传多文件示例代码
2017/02/20 PHP
PHP聊天室简单实现方法详解
2018/12/08 PHP
ThinkPHP框架整合微信支付之Native 扫码支付模式二图文详解
2019/04/09 PHP
laravel 事件/监听器实例代码
2019/04/12 PHP
Laravel获取所有的数据库表及结构的方法
2019/10/10 PHP
PHP页面静态化――纯静态与伪静态用法详解
2020/06/05 PHP
dwz 如何去掉ajaxloading具体代码
2013/05/22 Javascript
js表头排序实现方法
2015/01/16 Javascript
JavaScript DOM操作表格及样式
2015/04/13 Javascript
javaScript实现滚动新闻的方法
2015/07/30 Javascript
jQuery UI设置固定日期选择特效代码分享
2015/08/27 Javascript
底部悬浮通栏可以关闭广告位的实现方法
2016/06/01 Javascript
jQuery Ajax页面局部加载方法汇总
2016/06/02 Javascript
jstree创建无限分级树的方法【基于ajax动态创建子节点】
2016/10/25 Javascript
jquery获取select,option所有的value和text的实例
2017/03/06 Javascript
Angular.JS内置服务$http对数据库的增删改使用教程
2017/05/07 Javascript
JavaScript方法_动力节点Java学院整理
2017/06/28 Javascript
详解vue 模版组件的三种用法
2017/07/21 Javascript
three.js中3D视野的缩放实现代码
2017/11/16 Javascript
JavaScript设计模式之原型模式分析【ES5与ES6】
2018/07/26 Javascript
Vue表单控件绑定图文详解
2019/02/11 Javascript
js中arguments对象的深入理解
2019/05/14 Javascript
在layui中对table中的数据进行判断(0、1)转换为提示信息的方法
2019/09/28 Javascript
JS正则表达式验证端口范围(0-65535)
2020/01/06 Javascript
Python使用matplotlib实现在坐标系中画一个矩形的方法
2015/05/20 Python
Python爬虫实例_城市公交网络站点数据的爬取方法
2018/01/10 Python
python PyAutoGUI 模拟鼠标键盘操作和截屏功能
2019/08/04 Python
Python selenium使用autoIT上传附件过程详解
2020/05/26 Python
如何用 Python 制作一个迷宫游戏
2021/02/25 Python
Java中各种基本数据类型的默认值都是什么
2016/12/22 面试题
《蝙蝠和雷达》教学反思
2014/04/23 职场文书
南京大屠杀观后感
2015/06/02 职场文书
小学四年级作文之最感动的一件事
2019/11/01 职场文书
Mysql事务索引知识汇总
2022/03/17 MySQL