textarea 如何动态增加高度

最新推荐文章于 2024-04-18 14:46:56 发布

没有天赋全靠手打

最新推荐文章于 2024-04-18 14:46:56 发布

阅读量360

点赞数

分类专栏： JS笔记文章标签： css html html5

本文链接：https://blog.csdn.net/qq_45494634/article/details/120160011

版权

JS笔记专栏收录该内容

34 篇文章 1 订阅

订阅专栏

textarea 如何动态增加高度

HTML代码

<textarea 
name="title" 
id="title" 
rows="10" 
class="feedbk-textarea" 
placeholder="测试动态高度" 
autofocus="autofocus"
></textarea>

CSS代码

  .feedbk-textarea{
      margin: 0 10px 0 0!important;
      background-color: transparent;
      margin-bottom: 0;
      margin-top: 4px!important;
      border: 0;
      padding-left: 0;
      word-break: break-all;
      overflow-y: scroll; 
  }

JS代码

 var $title =document.getElementById('title')
 $title.addEventListener('input',function(){
     $title.style.height = 'auto';
     $title.style.width = $title.scrollHeight + "px";
 })