html input高度自适应,Textarea高度自适应，addEventListener("input", funcName);无效

对前端不是很了解，基本完全按照上面的那个思路写的。但是在Chrome53上面运行还是会出现scrollbar，不会自适应高度。请问这是不是有可能是addEventListener无法接听input事件呢？

html代码

js代码

function makeExpandingArea(container) {

var area = container.querySelector('textarea');

var span = container.querySelector('span');

area.addEventListener('input', function() {

span.textContent = area.value;

}, false);

span.textContent = area.value;

｝

var areas = document.querySelectorAll('div');

var l = areas.length;

console.log("%d", l);

while (l--) {

makeExpandingArea(areas[l]);

}

css代码

.expandingArea{

position:relative;

}

textarea{

position:absolute;

top:0;

left:0；

height:100%;

}

pre{

display:block;

visibility:hidden;

}

如果这个方法行不通的话能不能推荐一些可行的方法？主要用处是做一个博客的评论框，因为要提交form，所以又不能使用div的contenteditable="true"属性。