textarea自动扩展高度（jquery实现）

最新推荐文章于 2020-11-02 16:51:35 发布

weixin_33937913

最新推荐文章于 2020-11-02 16:51:35 发布

阅读量371

点赞数

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/willinchang/blog/343810

版权

2019独角兽企业重金招聘Python工程师标准>>>

源码迁移至：https://gitee.com/zhanghenry/codes/jz2pedmwa6x31lvb5kyrs16

项目中用到了textarea自动扩展高度的功能，网上查了几个都不太完善，稍微修改了一下，主要是添加了当内容删除时候的自动减少高度功能。如需指定textarea，修改选择器即可。

<!-- lang: js -->
 $(document).on("input propertychange", "textarea", function (e) {
       var target = e.target;
       // 保存初始高度，之后需要重新设置一下初始高度，避免只能增高不能减低。           
        var dh = $(target).attr('defaultHeight') || 0;
        if (!dh) {
            dh = target.clientHeight;
            $(target).attr('defaultHeight', dh);
        }
        
        target.style.height = dh +'px';
        var clientHeight = target.clientHeight;
        var scrollHeight = target.scrollHeight;
        if (clientHeight !== scrollHeight) { target.style.height = scrollHeight + 10 + "px";
        }
    });

转载于:https://my.oschina.net/willinchang/blog/343810