html---textarea初始化时就有个table空格以及tab键操作无效
生活随笔
收集整理的這篇文章主要介紹了
html---textarea初始化时就有个table空格以及tab键操作无效
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
1 初始化時就有一個tab空格 這是由于<textarea></textarea>之間的內(nèi)容不為空的原因，包含空格和換行，否則瀏覽器會覺得空格或者換行都是文本域的內(nèi)容。因此書寫時需將<textarea></textarea>緊靠在一起。 2 tab鍵對textarea操作無效 在textarea中使用tab鍵時是無效的。會切換到還有一個控件上去，可是當(dāng)我們有個須要時，要可以在文本域中使用tab鍵，可以使用javascript或者jquery方式實(shí)現(xiàn)： 方式1：javascript <script?src="http://julianlam.github.com/tabIndent.js/js/tabIndent.js"></script><!-- 導(dǎo)入tabindent.js腳本--> <script>tabIndent.renderAll();</script><!-- 應(yīng)用腳本--> 在textarea標(biāo)簽中的class="tabIndent" 實(shí)例： <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Test</title>
<style type="text/css"> .demo{width:600px; margin:30px auto; color:#51555c} .demo h3{height:32px; line-height:32px; font-size:18px} .demo h3 span{float:right; font-size:32px; font-family:Georgia,serif; color:#ccc; overflow:hidden} .demo textarea{width:600px;height:50px;} </style>
<script src="tabIndent.js"></script> </head> <body> <div class="demo"> <textarea name="saytxt" id="saytxt"?class="tabIndent"></textarea> <script>tabIndent.renderAll();</script> </div> </body> </html> ? ??
<style type="text/css"> .demo{width:600px; margin:30px auto; color:#51555c} .demo h3{height:32px; line-height:32px; font-size:18px} .demo h3 span{float:right; font-size:32px; font-family:Georgia,serif; color:#ccc; overflow:hidden} .demo textarea{width:600px;height:50px;} </style>
<script src="tabIndent.js"></script> </head> <body> <div class="demo"> <textarea name="saytxt" id="saytxt"?class="tabIndent"></textarea> <script>tabIndent.renderAll();</script> </div> </body> </html> ? ??
總結(jié)
以上是生活随笔為你收集整理的html---textarea初始化时就有个table空格以及tab键操作无效的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： ExtJS4.2学习(21)动态菜单与表
- 下一篇： Linux扩展根分区大小