javascript实现textarea中tab键的缩排处理方法
本文实例讲述了javascript实现textarea中tab键的缩排处理方法。分享给大家供大家参考。具体如下：
网上搜索了一下相关的解决方法，其它的有使用两三行javascript解决的，但都有一些小小的问题。还有使用JQuery的，也非常简洁。
本文的javascript代码实现了在TEXTAREA中输入TAB键并自动缩进的功能。不过这段代码在谷歌浏览器中不能正常执行，在
sel=event.srcElement.document.selection.createRange()
这一句会发生错误：
ncaughtexceptionTypeError:Cannotreadproperty'selection'ofundefined
代码在IE中正常执行，如下：
<mce:scripttype="text/javascript">
<!--
functioneditTab()
{
varcode,sel,tmp,r
vartabs=""
event.returnValue=false
sel=event.srcElement.document.selection.createRange()
r=event.srcElement.createTextRange()
switch(event.keyCode)
{
case(8):
if(!(sel.getClientRects().length>1))
{
event.returnValue=true
return
}
code=sel.text
tmp=sel.duplicate()
tmp.moveToPoint(r.getBoundingClientRect().left,sel.getClientRects()[0].top)
sel.setEndPoint("startToStart",tmp)
sel.text=sel.text.replace(/^/t/gm,"")
code=code.replace(/^/t/gm,"").replace(//r/n/g,"/r")
r.findText(code)
r.select()
break
case(9):
if(sel.getClientRects().length>1)
{
code=sel.text
tmp=sel.duplicate()
tmp.moveToPoint(r.getBoundingClientRect().left,sel.getClientRects()[0].top)
sel.setEndPoint("startToStart",tmp)
sel.text="/t"+sel.text.replace(//r/n/g,"/r/t")
code=code.replace(//r/n/g,"/r/t")
r.findText(code)
r.select()
}
else
{
sel.text="/t"
sel.select()
}
break
case(13):
tmp=sel.duplicate()
tmp.moveToPoint(r.getBoundingClientRect().left,sel.getClientRects()[0].top)
tmp.setEndPoint("endToEnd",sel)
for(vari=0;tmp.text.match(/^[/t]+/g)&&i<tmp.text.match(/^[/t]+/g)[0].length;i++)tabs+="/t"
sel.text="/r/n"+tabs
sel.select()
break
default:
event.returnValue=true
break
}
}
//-->
</mce:script>
使用时：
<textareacols=80rows=20name="input"onkeydown="editTab()"></textarea>
希望本文所述对大家的javascript程序设计有所帮助。