Just look at the code, it’s very simple and practical. Copy code The code is as follows: autoresizing textarea<br>textarea {<br> border: 0 none white; <br> overflow: hidden;<br> padding: 0;<br> outline: none;<br> background-color: #D0D0D0;<br> resize: none;<br>}<br> <br>var observe;<br>if (window.attachEvent) {<br> observe = function (element, event, handler) {<br> element. attachEvent('on' event, handler);<br> };<br>}<br>else {<br> observe = function (element, event, handler) {<br> element.addEventListener(event, handler, false );<br> };<br>}<br>function init () {<br> var text = document.getElementById('text');<br> function resize () {<br> text.style.height = 'auto';<br> text.style.height = text.scrollHeight 'px';<br> }<br> /* 0-timeout to get the already changed text */<br> function delayedResize () {<br> window.setTimeout(resize, 0);<br> }<br> observe(text, 'change', resize);<br> observe(text, 'cut', delayedResize);<br> observe(text, 'paste', delayedResize);<br> observe(text, 'drop', delayedResize);<br> observe(text, 'keydown', delayedResize); <p> text.focus();<br> text.select();<br> resize();<br>}<br>< body onload="init();">
