45fan.com - 路饭网

搜索: 您的位置主页 > 电脑频道 > 编程代码 > 阅读资讯:javascript程序设计之实现textarea中tab键的缩排处理的步骤

javascript程序设计之实现textarea中tab键的缩排处理的步骤

2016-09-10 14:30:39 来源:www.45fan.com 【

javascript程序设计之实现textarea中tab键的缩排处理的步骤

本文实例讲述了javascript实现textarea中tab键的缩排处理方法。分享给大家供大家参考。具体如下:

本文的javascript代码实现了在TEXTAREA中输入TAB键并自动缩进的功能。不过这段代码在谷歌浏览器中不能正常执行,在


复制代码 代码如下:
sel =event.srcElement.document.selection.createRange()

这一句会发生错误:
ncaught exception TypeError: Cannot read property 'selection' of undefined

 

代码在IE中正常执行,如下:

<mce:script type="text/javascript">
<!-- 
function editTab() 
{ 
 var code, sel, tmp, r 
 var tabs="" 
 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 (var i=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>

使用时:


复制代码 代码如下:
<textarea cols=80 rows=20 name="input" onkeydown="editTab()"></textarea>

 

希望本文所述对大家的javascript程序设计有所帮助。


本文地址:http://www.45fan.com/bcdm/74238.html
Tags: 实现 JavaScript textarea
编辑:路饭网
推广内容
推荐阅读
热门推荐
推荐文章
关于我们 | 联系我们 | 友情链接 | 网站地图 | Sitemap | App | 返回顶部