简化的enter转化成tab组件

2016-01-29 11:38 6 1 收藏

简化的enter转化成tab组件,简化的enter转化成tab组件

【 tulaoshi.com - Javascript 】

<script language="JavaScript"
<!--

// 用途:enter 转化成tab
//使用:onload ="initEnter2Tab()" form标记加上 <form name="frm" type="enter2tab"...</form

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/javascript/)

var isCycle = false; //当光标到最后一个元素的时候,是否循环光标焦点,
var iCurrent = -1;
var frmName = "0"//input_form
//
function enterToTab()  //网页里按回车时焦点的转移
{
  var e = document.activeElement;
  if(e == null) return false;
  //获得当前表单的名字
  for(i=0;i<document.forms.length;i++){ 
 for(var el in document.forms[i].elements){
  if(e.UniqueID == el.UniqueID){
   frmName = document.forms[i].name
  }   
 }
  }
  if(window.event.keyCode == 13)
  { 
   switch(e.tagName)//标签类型
 {
     case "INPUT":
   handleInput(e)
   break;
     case "SELECT":
   handleSelect(e)  
   break; 
     case "TEXTAREA":
   handleTextarea(e)
   break;  
         default: 
    //window.status = "未知的标签名称:"+e.tagName+",不能移动焦点!"
    } 
  }// end if
}
//处理input 标签类型
function handleInput(e)
{
   switch(e.type)
 {
     case "text":
  case "password":
  case "checkbox":
  case "radio":
  case "file":
   moveFocusToNextElement(e)
   break;
  case "submit"://处理有提交按钮的情况
  case "button":
   if(isHandleSubmit(e)){
    handleSubmit(e)
    focusOnNextElement(document.forms[frmName].elements,iCurrent-1)
    break;
   }
   moveFocusToNextElement(e)
   break;           
         default: 
    }
}
//处理select 标签类型
function handleSelect(e)
{
 moveFocusToNextElement(e)
}
//处理textarea 标签类型
function handleTextarea(e)
{
 moveFocusToNextElement(e)
}
//移动到下一个元素
function moveFocusToNextElement(e)
{
  var oE = document.forms[frmName].elements, iCurentPos=-1;
  for(var i=0; i<oE.length; i++)
  {
    if(oE[i] == e) iCurentPos = i;
    if(iCurentPos-1 && iCurentPos+1<oE.length)
    {
    //把焦点设置到下一个可用的元素上 
  focusOnNextElement(oE,iCurentPos)
    }
  }
}
//下一个可用元素得到焦点 n 元素的位置
function focusOnNextElement(oElements,iIndex)
{
 var oE = oElements
 var oldIndex = iIndex
  while(oE[iIndex+1].type =="hidden" || oE[iIndex+1].disabled || oE[iIndex+1].readOnly == true || oE[iIndex+1].style.display == "none")
  {
   /*
   window.status += "e.name = "+oE[iIndex+1].name
   window.status += ";e.type = "+oE[iIndex+1].type
   window.status += ";e.disabled = "+oE[iIndex+1].disabled
   window.status += ";e.readOnly = "+oE[iIndex+1].readOnly+"."
   */
   iIndex++;
   if(iIndex+1 == oE.length)
   {
    if(isCycle){//设置焦点在第一元素
     focusOnNextElement(oE,-1)
    }   
    return;
   }  
  }//end while
  iCurrent = iIndex+1
  oE[iCurrent].focus();
        window.event.keyCode    = 0;
        window.event.returnValue= fal

来源:https://www.tulaoshi.com/n/20160129/1482854.html

延伸阅读
标签: 电脑入门
利用WPS自带的功能可以轻易地将Word文档转化成PDF格式,主要分为以下两步: 第一步:用WPS文字打开要转换的Word文档 第二步:选择[文件]-[输出为PDF格式],在随即出现的对话框内设置PDF的格式输出需要,点击[确认]就OK了!
多朋友想用SQL2000数据库的编程方法,但是却又苦于自己是学ACCESS的,对SQL只是一点点的了解而已,这里我给大家提供以下参考---将ACCESS转化成SQL2000的方法和注意事项 一,首先,我说的是在ACCESS2000,SQL2000之间转换,其他的我也还没有尝试过,希望大家多多试验,肯定是有办法的; 二,转换的方法 1,打开”控制面板...
很多朋友想用SQL2000数据库的编程方法,但是却又苦于自己是学ACCESS的,对SQL只是一点点的了解而已,这里我给大家提供以下参考---将ACCESS转化成SQL2000的方法和注意事项 一,首先,我说的是在ACCESS2000,SQL2000之间转换,其他的我也还没有尝试过,希望大家多多试验,肯定是有办法的; 二,转换的方法 1,打开"控制面板"下"管理工具"中的"...
标签: PS PS基础
最终效果 下面是原图 1、打开图片,ctrl+j复制图层,执行ctrl+shift+u 去色。 2、ctrl+j 复制 ctrl+i 反相,更改图层的混合模式,设置为颜色减淡在图层面板不透明度左边那一栏的 正常里调整。这个时候基本是白色。 3、滤镜-其它-最小值 设置为2,大小自己看着设置。 4、双击图层弹出图层样式对话框,对混合选项进行设...
多朋友想用SQL2000数据库的编程方法,但是却又苦于自己是学ACCESS的,对SQL只是一点点的了解而已,这里我给大家提供以下参考---将ACCESS转化成SQL2000的方法和注意事项 一,首先,我说的是在ACCESS2000,SQL2000之间转换,其他的我也还没有尝试过,希望大家多多试验,肯定是有办法的; 二,转换的方法 1,打开”控制面板“下”管理工具“...

经验教程

920

收藏

7
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部