div仿textarea可输入

原本要用textarea，但是后来发现好像只有IE支持textarea里边使用html标签，由于需要在textarea中显示一条横线（<hr />），在网上查了很久，都说textarea是纯文本不能使用html标签，但是可以换成div代替，这下就方便多了，因此放弃textarea，代码如下：

html代码：

 <div class="textareadiv">

                 <div id="txtSayWords" contenteditable="true" onfocus="AutoContents('in')" onblur="AutoContents('out')">输入您要说的话...不少于10个字</div>

                 <div id="replydiv"></div>

                 </div>

html

CSS代码：

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

CSS

JS代码：

 var defaultVal = "输入您要说的话...不少于10个字"; //默认文本框内容

 function AutoContents(type) {

     var txtVal = $("#txtSayWords").html(); //文本框获取或失去焦点时的文本框内容

     //文本框获取焦点

     if (type == "in") {

         //主动说话操作

         if (txtVal == defaultVal) {//表示内容为空

             //清空文本框

             $("#txtSayWords").html("");

         }

     } else if (type == "out") {//文本框失去焦点

         //如果内容为除去默认值以外的值，则需自动填充默认值+除默认值以外的

         //主动说话操作

         if (txtVal == "") {//没有输入内容

             //如果焦点离开文本框时内容为空，表示没有输入任何内容，则需自动填充默认值

             $("#txtSayWords").html(defaultVal);

         }

     }

 }

到这里终于可以完工了，也该下班休息了，呵呵呵！

巴特西

div仿textarea可输入

最新文章

热门文章