jQuery让textarea自适应高度

Posted 2020-10-19 流氓大师

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jQuery让textarea自适应高度相关的知识，希望对你有一定的参考价值。

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>

<body>
<textarea name="" id="textarea" class="mytest"></textarea>
</body>
<script src="js/jquery-2.1.1.min.js"></script>
<script>
        //jQuery实现textarea高度根据内容自适应
        $.fn.extend({
          txtaAutoHeight: function () {
                return this.each(function () {
                var $this = $(this);
                      if (!$this.attr(‘initAttrH‘)) {
                         $this.attr(‘initAttrH‘, $this.outerHeight());
                    }
                    setAutoHeight(this).on(‘input‘, function () {
                        setAutoHeight(this);
                   });
                });
                 function setAutoHeight(elem) {
                    var $obj = $(elem);
                    return $obj.css({ height: $obj.attr(‘initAttrH‘), ‘overflow-y‘: ‘hidden‘ }).height(elem.scrollHeight);
                 }
          }
         });
    
         //调用
         $(function () {
            $(".mytest").txtaAutoHeight();
         });
</script>
</html>

以上是关于jQuery让textarea自适应高度的主要内容，如果未能解决你的问题，请参考以下文章

jQuery实现textarea高度根据内容自适应