热门关键字:
jquery > jquery教程 > jquery教程 > jQuery textarea框高度自适应

jQuery textarea框高度自适应

280
作者:管理员
发布时间:2020/3/3 14:51:55
评论数:0
转载请自觉注明原文:http://www.jq-school.com/Show.aspx?id=963

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title></title>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
<script type="text/javascript">
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);
      });
    });
    function _adjustH(elem){
      var $obj = jQuery(elem);
      return $obj.css({
        height: $obj.attr('_initAdjustHeight'),
        'overflow-y': 'hidden'
      }).height( elem.scrollHeight );
    }
  }
});
$(function(){
  $('textarea').autoHeight();
 });
</script>
</head>
<body>
<textarea id="txt"></textarea>
</body>
</html>
上面代码完美实现高度自适应功能,更多内容参阅下面文章。






如果您觉得本文的内容对您的学习有所帮助:支付鼓励



关键字:css
友荐云推荐