当前位置: 首页 > 编程笔记 >

jquery实现textarea 高度自适应

狄望
2023-03-14
本文向大家介绍jquery实现textarea 高度自适应,包括了jquery实现textarea 高度自适应的使用技巧和注意事项,需要的朋友参考一下

之前给大家分享过用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能够有所帮助。

 类似资料:
  • 本文向大家介绍教你用jquery实现iframe自适应高度,包括了教你用jquery实现iframe自适应高度的使用技巧和注意事项,需要的朋友参考一下 iframe代码,注意要写ID jquery代码一: jquery代码二:

  • 本文向大家介绍如何让textarea高度自适应呢?相关面试题,主要包含被问及如何让textarea高度自适应呢?时的应答技巧和注意事项,需要的朋友参考一下 使用 div contenteditable 模拟的代价实在太大了。 推荐看看 ant-design 和 elementUI 的源码设计即可。 https://github.com/ElemeFE/element/blob/dev/packag

  • 本文向大家介绍jquery 插件实现多行文本框[textarea]自动高度,包括了jquery 插件实现多行文本框[textarea]自动高度的使用技巧和注意事项,需要的朋友参考一下 实现功能: 1/当textarea换行时自动增加一行高度 2/当textarea删除一行时 自动减少一行的高度 依赖:jquery.xxx.js 工作中需要使用类似功能但是觉得使用插件需要导入其他文件很不方便所以就写

  • 问题内容: 我想使textarea的高度等于其中的文本的高度(并删除滚动条) HTML CSS 问题答案: 可以使用JS实现。 这是一个使用elastic.js的“单行” 解决方案: 更新:似乎不再有elastic.js,但是如果您正在寻找一个外部库,我可以推荐JackMoore的 autosize.js 。这是工作示例:

  • 本文向大家介绍javascript原生和jquery库实现iframe自适应高度和宽度,包括了javascript原生和jquery库实现iframe自适应高度和宽度的使用技巧和注意事项,需要的朋友参考一下 javascript原生和jquery库实现iframe自适应内容高度和宽度---推荐使用jQuery的代码! 基于Jquery库的代码很好实现: ‍基于JS原生代码的实现: 只需在你被ifr

  • 本文向大家介绍jQuery实现textarea自动增长宽高的方法,包括了jQuery实现textarea自动增长宽高的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了jQuery实现textarea自动增长宽高的方法。分享给大家供大家参考,具体如下: 希望本文所述对大家jQuery程序设计有所帮助。