HTMLテキストフィールドのtextareaの高さの増加、ラップ

次のようにテキストフィールド、エネルギー自給の高さを、ラップ：

HTML：

<TEXTAREA行= "1" クラス= "answerTextArea" MAXLENGTH = "60"> </ TEXTAREA>

CSS：

.answerTextArea { 
    幅：100％ 。
    高さ：自動 ; 
    国境：なし ; 
    概要：なし。
    フォントサイズ：0.6rem。
    色：#FFF ; 
    背景：なし。
    ボックスサイズ：ボーダーボックス ; 
    パディング：0.4rem 0 ; 
    border-bottom：1pxの固体#FFF ; 
}

jsの機能を実現します：

// 入力テキストフィールドを監視し、自動的に高さ変化
関数makeExpandingArea（EL）{
    VARのタイマ= NULL ;
    // IE8スタックオーバーフローの問題ので、ここでは調整される
   VARのsetStyleを= 関数（EL、オート）{
        IF（オート）EL。 = style.height '自動車' ; 
       el.style.height = el.scrollHeight + 'PX' ; 
   } 
   VARの delayedResize = 関数（EL）{
        IF （タイマ）{ 
           てclearTimeout（タイマ）; 
           タイマ = NULL ; 
       } 
       タイマーのsetTimeoutを（= 機能（）{ 
           のsetStyle（EL）
       }、 200 ）。
   } 
   であれば（el.addEventListener）{ 
       el.addEventListener（ '入力'、関数（）{ 
           でsetStyle（EL、 1 ）; 
       }、偽）。
       setStyle（EL）
   } そう であれば（el.attachEvent）{ 
       el.attachEvent（ 'onpropertychange'、関数（）{ 
           のsetStyle（EL）
       }）
       のsetStyle（EL）
   } 
   場合（window.VBArray && window.addEventListener）{ // IE9
       el.attachEvent（ "にonKeyDown"、関数（）{
            VARのキー= window.event.keyCode;
            場合（キー== 8 ||キー== 46 ）delayedResize（EL）; 

       }）; 
       el.attachEvent（ "のoncut"、関数（）{ 
           delayedResize（EL）; 
       }）; // 处理粘贴
   } 
} 

// 监听文本换行
関数exeTextLine（OBJ）{
     場合（OBJ == "" ）{
         VARの textareaList = document.getElementsByClassName（ 'answerTextArea' ）。
        
        用（VARi = 0; iはtextareaList.length <; iは++ ）{ 
            makeExpandingArea（textareaList [I]）。
        } 
    } 他{ 
        makeExpandingArea（OBJ）。
    } 
    
} 

exeTextLine（ ""）。

結果は以下の通りであります：