基于jquery的让textarea自适应高度的插件

  Introduction

  1. This textarea is like the google calendar's description when you create one new or update one existence calendar;

  2. Its height will be changed accroding to user's input;

  3. Its scrollbar is removed, which makes it much user friendly. I guess you may like it.

  Using the code

  1. import the jquery.js and textarea.js

  <script language="javascript" type="text/javascript" src="js/jquery.min.js"></script>

  <script language="javascript" type="text/javascript" src="js/textarea.js"></script>

  2. add the following css

  <style type="text/css">

  .autoHeight{border:1px solid #666666; width:300px; height:60px; line-height:20px; font:11px verdana; overflow:hidden;}

  </style>

  3. add one textare html control

  <textarea class="autoHeight" id="textarea1"></textarea>

  4. make it works

  <script language="javascript" type="text/javascript">

  $(document).ready(function () {

  $(".autoHeight").TextAreaAutoHeight();

  });

  </script>