hogehoge foobar Blog Style Beta

Web,Mac,Linux,JavaScript,Perl,PHP,RegExp,Git,Vim,Redmineなど技術的なことのメモや、ちょっと便利そうなものの紹介をしています。

textareaのサイズを入力にあわせて調整

なかなか便利なtextareaのサイズを入力にあわせて調整するJavaScript
イラストdeブログ開発記さんと404 Blog Not Foundさんで紹介されています。

textareaのサイズを入力にあわせて調整するJavaScript (イラストdeブログ開発記)

function textareaResize(event)
{
   try {
       elem_id = event.srcElement.id;
   } catch ( e ) {
       elem_id = event.target.id;
   }
   var keycode = event.keyCode;
   if (keycode == 13) {
       var m = document.getElementById(elem_id);
       var r = m.getAttribute("rows");
       m.setAttribute("rows", parseInt(r)+1);
   }
}

javascript - 勝手に添削 - textareaの高さを自動調節(404 Blog Not Found)

function resize_textarea(ev){
   //if (ev.keyCode != 13) return;
   var textarea = ev.target || ev.srcElement;
   var value = textarea.value;
   var lines = 1;
   for (var i = 0, l = value.length; i < l; i++){
       if (value.charAt(i) == '\n') lines++;
    }
    textarea.setAttribute("rows", lines);
    // window.status = lines;
}

ということで、自分でも勝手にコードを変更してみました。
一応コード量削減を目的に正規表現を利用して作ってみました。
処理速度とかは考慮していないので、上記の2つのコードに劣るかもしれません。

//自分でコード行数を勝手に削減版
function resize_textarea(ev){
   var textarea = ev.target || ev.srcElement;
   var match = textarea.value.match(/\n/g);
   textarea.setAttribute("rows", ( match ? match.length : 0 ));
}