学习到textarea高度自适应的方法

 jq的话这个也可以作者：WTIFS
链接： https://www.zhihu.com/question/32295778/answer/119649853
来源：知乎
著作权归作者所有，转载请联系作者获得授权。

1. JQUERY
$('textarea').each(function () {
  this.setAttribute('style', 'height:' + (this.scrollHeight) + 'px;overflow-y:hidden;');
}).on('input', function () {
  this.style.height = 'auto';
  this.style.height = (this.scrollHeight) + 'px';
});

2. JQUERY + CSS
function setHeight(element) {
  $(element).css({'height':'auto','overflow-y':'hidden'}).height(element.scrollHeight);
}
$('textarea').each(function () {
  setHeight(this);
}).on('input', function () {
  setHeight(this);
});


测试通过环境：
Firefox v31
Chrome v37 
IE v11
(jQuery 1.7.2 - 2.1.3)

原理：
利用textarea的scrollHeight属性，设置高度为scrollHeight
scrollHeight返回元素的完整的高度，以像素为单位
当一个元素拥有滚动条时（比如由于 CSS 的 overflow 属性），这些属性和 offsetHeight 不同，offsetHeight只是报告元素的可见部分的大小