TaoGOGO的技术博客,关注LAMP,Web编程,前端开发和网络赚钱。

替换textarea里的tabindex属性的js(兼容火狐与ie)

六月 30th, 2009 | 评论:(0)

<script language="JavaScript">
<!--
var TextAreaTab =
{
   Register : function(obj)
   {
       // 绑定事件
       obj.onclick = new Function('TextAreaTab.CreateInsertPosition(this)');
       obj.onselect = new Function('TextAreaTab.CreateInsertPosition(this)');
       obj.onkeyup = new Function('TextAreaTab.CreateInsertPosition(this)');
       obj.onkeydown = new Function('TextAreaTab.InsertTab(this)');
   },
   // 这个只对ie有用
   // 创建光标所在位置的对象,就是要插入的位置。
   // 其实就是光标选中的对象,对它进行操作就可以了。
   CreateInsertPosition : function(obj)
   {
       if (obj.createTextRange) // IE
       {
           obj.InsertPosition = document.selection.createRange().duplicate(); // 光标选中的对象
       }
   },
   InsertTab : function(obj)
   {
       var evt = this.GetEvent(); // 返回 event 对象
       if (evt.keyCode == 9) // 按下了Tab键
       {
           if (obj.createTextRange && obj.InsertPosition) // IE
           {
               // 赋予对象内容
               obj.InsertPosition.text = '\t';
               evt.returnValue = false;
           }
           else if (window.getSelection) // FF
           {
               var scrollTop = obj.scrollTop; // 滚动的位置
               var start = obj.selectionStart; // 当前光标所在位置

               var pre = obj.value.substr(0, obj.selectionStart); // 光标之前的内容
               var next = obj.value.substr(obj.selectionEnd); // 光标之后的内容
               obj.value = pre + '\t' + next;

               evt.preventDefault();
               // 设置光标在插入点之后的位置
               obj.selectionStart = start + 1;
               obj.selectionEnd = start + 1;
               obj.scrollTop = scrollTop;
           }
       }
   },
   // 返回 event 对象
   GetEvent : function()
   {
       if(document.all) // IE
       {
           return window.event;
       }

       func = this.GetEvent.caller;
       while(func != null)
       {
           var arg0 = func.arguments[0];
           if(arg0)
           {
               if((arg0.constructor == Event || arg0.constructor == MouseEvent)
                   ||(typeof(arg0) == "object" && arg0.preventDefault && arg0.stopPropagation))
               {
                   return arg0;
               }
           }
           func = func.caller;
       }
       return null;
   }
}
//-->
</script>
tabindex="4"
<textarea id="TextArea" rows="10" cols="50"></textarea>
<script language="JavaScript">
<!--
var textarea = document.getElementById('TextArea');
TextAreaTab.Register(textarea); // 注册一下对象,就可以让这个对象现实Tab功能
//-->
</script>

类别: web前端开发 | 关键字: js tabindex 兼容 textarea | 阅读:(835)

想收藏或者和大家分享这篇好文章→

发表评论

姓名:

邮箱:

网址:

请输入计算结果:3+5

Tao公告

好消息!co.cc免费域名国内可以注册使用啦@2010.05.10
推荐免费英语学习+聊天室软件@2010.07.21

搜索

加工中~马上就好 加载中…