textarea高度随文字增多变化高度

来源：互联网发布：淘宝客服售前话术大全编辑：程序博客网时间：2024/04/30 22:18

<!DOCTYPE html><html><head><title>autoresizing textarea</title><script src="js/jquery.min.js"></script><style type="text/css">textarea {    border: 1px solid red;    overflow: hidden;    padding: 0;min-height:100px;max-height:300px;}</style></head><body onload="init();"><textarea rows="5" style="height:25px;" id="text"></textarea><script type="text/javascript">var observe;if (window.attachEvent) {    observe = function (element, event, handler) {        element.attachEvent('on'+event, handler);    };}else {    observe = function (element, event, handler) {        element.addEventListener(event, handler, false);    };}function init () {    var text = document.getElementById('text');    function resize () {        text.style.height = 'auto';        text.style.height = text.scrollHeight+'px';    }    /* 0-timeout to get the already changed text */    function delayedResize () {        window.setTimeout(resize, 0);    }    observe(text, 'change',  resize);    observe(text, 'cut',     delayedResize);    observe(text, 'paste',   delayedResize);    observe(text, 'drop',    delayedResize);    observe(text, 'keydown', delayedResize);    text.focus();    text.select();    resize();}</script></body></html>

0 0