textarea 使用

1. resize：是否允许拖拽textarea右下角调整大小 

resize: vertical;   只允许垂直方向拖拽
resize:horizontal;  只允许水平方向拖拽
resize: none; 不允许拖拽
resize: both; 允许垂直 水平 拖拽

2. 滚动条
scrollbar属性、样式详解
overflow内容溢出时的设置（设定被设定对象是否显示滚动条）
    overflow-x水平方向内容溢出时的设置
    overflow-y垂直方向内容溢出时的设置
    以上三个属性设置的值为visible(默认值)、scroll、hidden、auto。
1> 没有水平滚动条
   <textarea style="overflow-x:hidden"></textarea>
 2> 没有垂直滚动条
   <textarea style="overflow-y:hidden"></textarea>
3> 没有滚动条
   <textarea style="overflow-x:hidden;overflow-y:hidden"></textarea>
   或<textarea style="overflow:hidden"></textarea>

3. JS控制TextArea滚动条自动滚动到最下部 
var scrollHeight = $("#dd").get(0).scrollHeight;
$("#dd").animate({
    scrollTop:scrollHeight
})
//无动画效果 js
document.getElementByIdx_x_x('textarea').scrollTop = document.getElementByIdx_x_x('textarea').scrollHeight

4. js控制textarea滚动条 模拟鼠标点击滚动条往下滚 +=  往上-=
var scrollHeight = $("#dd").get(0).scrollHeight;
$("#dd").animate({
    "scrollTop":"+=5"
})
5. 只是固定大小，右下角的拖动图标仍在

  
  

   
   
width: 200px;
  
  
  
  

   
   
height: 100px;
  
  
  
  

   
   
max-width: 200px;
  
  
  
  

   
   
max-height: 100px;
  
  
6. css控制textarea固定大小不出现滚动条
{width:100px;height:100px;resize:none;overflow:hidden}

7.关于textarea文本域以及高度自适应

多行文本域功能来讲，textarea满足了我们大部分的需求。然而，textarea有一个不足就是不能像普通div标签一样高度可以跟随内容自适应.实现当输入一些文字后，文本域的高度自动随内容多少撑高

div模拟textarea文本域及高度自适应，block元素上加个contenteditable="true"就ok了解决可编辑，使用min-height属性解决高度自适应

.test_box {
    width: 400px; 
    min-height: 120px; //自适应高度
    max-height: 300px; //最大高度(max-height)，让其超出的时候出现滚动条
    _height: 120px; //兼容ie
    margin-left: auto; 
    margin-right: auto; 
    padding: 3px; 
    outline: 0; 
    border: 1px solid #a0b3d6; 
    font-size: 12px; 
    word-wrap: break-word;
    overflow-x: hidden;
    overflow-y: auto;
    _overflow-y: visible;
}

<div class="test_box" contenteditable="true"><br /></div>