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 相关文章推荐
PHP 与 js的通信(via ajax,json)
Nov 16 Javascript
js获得网页背景色和字体色的方法
Mar 21 Javascript
node.js中的fs.fstatSync方法使用说明
Dec 15 Javascript
用原生js统计文本行数的简单示例
Aug 19 Javascript
Bootstrap Navbar Component实现响应式导航
Oct 08 Javascript
HTML5基于Tomcat 7.0实现WebSocket连接并实现简单的实时聊天
Oct 31 Javascript
JavaScript实现分页效果
Mar 28 Javascript
详谈表单重复提交的三种情况及解决方法
Aug 16 Javascript
jQuery实现对网页节点的增删改查功能示例
Sep 18 jQuery
vue学习笔记之作用域插槽实例分析
Feb 01 Javascript
ES6中new Function()语法及应用实例分析
Feb 19 Javascript
JavaScript禁止右击保存图片,禁止拖拽图片的实现代码
Apr 28 Javascript
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
全国FM电台频率大全 - 20 广西省
2020/03/11 无线电
PHP封装的MSSql操作类完整实例
2016/05/26 PHP
cnblogs TagCloud基于jquery的实现代码
2010/06/11 Javascript
jquery 实现窗口的最大化不论什么情况
2013/09/03 Javascript
深入理解JavaScript单体内置对象
2016/06/06 Javascript
vue数字类型过滤器的示例代码
2017/09/07 Javascript
vuex提交state&&实时监听state数据的改变方法
2018/09/16 Javascript
如何优雅地在vue中添加权限控制示例详解
2019/03/07 Javascript
JavaScript如何实现元素全排列实例代码
2019/05/14 Javascript
[59:48]LGD vs IG 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
Python基于pygame实现图片代替鼠标移动效果
2015/11/11 Python
python对配置文件.ini进行增删改查操作的方法示例
2017/07/28 Python
python中@property和property函数常见使用方法示例
2019/10/21 Python
PyPDF2读取PDF文件内容保存到本地TXT实例
2020/05/12 Python
python中watchdog文件监控与检测上传功能
2020/10/30 Python
使用CSS3来代替JS实现交互
2017/08/10 HTML / CSS
HTML5利用约束验证API来检查表单的输入数据的代码实例
2016/12/20 HTML / CSS
HTML5新特性之type=file文件上传功能
2018/02/02 HTML / CSS
英国高端食品和葡萄酒超市:Waitrose
2016/08/23 全球购物
北美大型运动类产品商城:Champs Sports
2017/01/12 全球购物
Spartoo荷兰:鞋子、包包和服装
2018/07/12 全球购物
毕业生自我鉴定
2013/12/04 职场文书
调解协议书
2014/04/16 职场文书
桥梁工程专业求职信
2014/04/21 职场文书
幼儿园亲子活动总结
2014/04/26 职场文书
毕业生实习期转正自我鉴定
2014/09/26 职场文书
教师党的群众路线教育实践活动学习心得体会
2014/10/30 职场文书
2014年房产销售工作总结
2014/12/08 职场文书
2014年英语教学工作总结
2014/12/17 职场文书
2015年世界水日活动总结
2015/02/09 职场文书
最美乡村教师观后感
2015/06/11 职场文书
Nginx+Tomcat实现负载均衡、动静分离的原理解析
2021/03/31 Servers
Vue实现下拉加载更多
2021/05/09 Vue.js
Java移除无效括号的方法实现
2021/08/07 Java/Android
索尼ICF-5900W收音机测评
2022/04/24 无线电
Android Canvas绘制文字横纵向对齐
2022/06/05 Java/Android