源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

Textarea根据内容自适应高度

  • 时间:2022-11-15 12:08 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:Textarea根据内容自适应高度
直接看代码吧,很简单,也很实用。
[u]复制代码[/u] 代码如下:
<!DOCTYPE html> <html> <head> <title>autoresizing textarea</title> <style type="text/css"> textarea {     border: 0 none white;     overflow: hidden;     padding: 0;     outline: none;     background-color: #D0D0D0;     resize: none; } </style> <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> </head> <body onload="init();"> <textarea cols="40" rows="1" style="height:25px;" id="text"></textarea> </body> </html>
 
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部