JavaScriptプログラムに関する各種メモ書き

入力文字数によってテキストフィールド<textarea>のサイズを変える

A. jQueryを使用してテキストエリアを動的に変更する。【jquery.elastic.js】

http://www.unwrongest.com/projects/elastic/

$(document).ready(function(){
    // 読み込み時にリサイズ
    $('textarea#my_text_area').elastic();
    // クリック時にリサイズ
    $('textarea#text_name').bind("click", function(){
      $('textarea#text_name').elastic();
    });
});
B. jQueryを使用してテキストエリアを動的に変更する。【autoresize.jquery.js】

http://james.padolsey.com/javascript/jquery-plugin-autoresize/

<script type="text/javascript" src="autoresize.jquery.js"></script>  
<script type="text/javascript"> 
$(document).ready(function(){
    $('textarea#my_text_area').autoResize();
});
</script>
C. prototype.js を使用してテキストエリアを自動的に変更する。

http://jroller.com/page/rmcmahon?entry=resizingtextarea_with_prototype

D. jQueryを使用してテキストエリアを動的に変更する。【jquery.autogrow-textarea.js】

http://javascriptly.com/2008/09/quick-useful-jquery-plugins/

ダウンロード:

http://github.com/jaz303/jquery-grab-bag/blob/master/javascripts/jquery.autogrow-textarea.js

$(document).ready(function(){
  $('textarea#mytextarea').autogrow();
});

関連エントリー

No.520
04/28 11:51

edit

prototype.js
jQuery