文本域的高度自适应

标签：

<textarea maxlength="100" class="text" data-adaptheight rows="3" cols="40" placeholder="Your input"
          style="padding: 16px; line-height: 1.5;"></textarea>
<script>
    (function () {
        function adjustHeight(el, minHeight) {
            var outerHeight = parseInt(window.getComputedStyle(el).height, 10);
            var diff = outerHeight - el.clientHeight;
            el.style.height = 0;
            el.style.height = Math.max(minHeight, el.scrollHeight + diff) + ‘px‘;
        }
        var textAreas1 = document.getElementsByClassName(‘text‘);
        for(var i = 0; i< textAreas1.length;  i++) {
            foo([textAreas1[i]]);
        }
        function foo(textAreas){
            for (var i = 0, l = textAreas.length; i < l; i++) {
                var el = textAreas[i];
                el.style.boxSizing = el.style.mozBoxSizing = ‘border-box‘;
                el.style.overflowY = ‘hidden‘;
                var minHeight = el.scrollHeight;
                el.addEventListener(‘input‘, function () {
                    adjustHeight(el, minHeight);
                });
                window.addEventListener(‘resize‘, function () {
                    adjustHeight(el, minHeight);
                });
                adjustHeight(el, minHeight);
            }};
    }());
</script>

文本域的高度自适应

标签：

原文地址：http://www.cnblogs.com/dream0530/p/5664426.html