div仿textarea可輸入

本來要用textarea，可是後來發現好像只有IE支持textarea裏邊使用html標籤，因爲須要在textarea中顯示一條橫線（<hr />），在網上查了好久，都說textarea是純文本不能使用html標籤，可是能夠換成div代替，這下就方便多了，所以放棄textarea，代碼以下：

html代碼：

1 <div class="textareadiv">
2                 <div id="txtSayWords" contenteditable="true" onfocus="AutoContents('in')" onblur="AutoContents('out')">輸入您要說的話...很多於10個字</div>
3                 <div id="replydiv"></div>
4                 </div>

html

CSS代碼：

1 .textareadiv{border:1px #ad0d0d solid;resize: none;height:97px;width:671px;padding:9px;color:#848484;font-size:12px;overflow:auto;}

CSS

JS代碼：

 1 var defaultVal = "輸入您要說的話...很多於10個字"; //默認文本框內容
 2 function AutoContents(type) {
 3     var txtVal = $("#txtSayWords").html(); //文本框獲取或失去焦點時的文本框內容
 4     //文本框獲取焦點
 5     if (type == "in") {
 6         //主動說話操做
 7         if (txtVal == defaultVal) {//表示內容爲空
 8             //清空文本框
 9             $("#txtSayWords").html("");
10         }
11     } else if (type == "out") {//文本框失去焦點
12         //若是內容爲除去默認值之外的值，則需自動填充默認值+除默認值之外的
13         //主動說話操做
14         if (txtVal == "") {//沒有輸入內容
15             //若是焦點離開文本框時內容爲空，表示沒有輸入任何內容，則需自動填充默認值
16             $("#txtSayWords").html(defaultVal);
17         }
18     }
19 }

JS

到這裏終於能夠完工了，也該下班休息了，呵呵呵！