设为首页
加入收藏
站内地图
旧版入口
当前位置：首页 > 站长学院 > 网络编程 > ASP.NET

利用键盘上的上下左右（回车）键模拟出tab 键的功能上下左右移动焦点

作者：佚名 出处：网络转载 时间：07-30 点击：

内容载入中...
支持原创支持 上学堂 <HTML>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/HTML; charset=gb2312">
<script language="JavaScript">
var cols=3;
var obj;
var CanMove=false;
var key;
function setobj(input){
    obj=input;
}

function init(){
    document.onkeydown=keyDown;
    document.onkeyup=keyUp;
}

function keyDown(DnEvents){
    var key=window.event.keyCode;
    if(key==116){
        window.event.keyCode=0;
        return false;
    }
    if(key==8){
        if(event.srcElement.tagName!="INPUT"){
            event.cancelBubble = true;
            event.returnValue = false;
            return false;
        }
    }
     //此处为按下ctrl  注释此处可以实现不需要ctrl
    var IsCtrl=window.event.ctrlKey;
    if(!IsCtrl){
        return;
    }
    for(var i=0;i<document.forms[0].elements.length;i++){
        if(document.forms[0].elements[i]==obj){
            if (key == 37){//←
                if(i>0){
                    document.forms[0].elements[i-1].focus();
                }
            }
            if (key == 38){//↑
                if(i>cols-1){
                    document.forms[0].elements[i-cols].focus();
                }
            }
            if (key == 39){//→
                if(i<document.forms[0].elements.length-1){
                    document.forms[0].elements[i+1].focus();
                }
            }

                  if (key == 13)
                  {//→ 
                                    event.keyCode = 9; 
                   }
            if (key == 40){//↓
                if(i<document.forms[0].elements.length-cols){
                    document.forms[0].elements[i+cols].focus();
                }
            }
        }
    }

}

function keyUp(UpEvents){
    return false;
}
</script>
</head>

<body bgcolor="#FFFFFF" text="#000000" onload="init()">
<form>
<table border="0" cellspacing="0" cellpadding="0" align="center">
  <tr>
    <td>
      <input type="text" name="textfield" onfocus="setobj(this)">
    </td>
    <td>
      <input type="text" name="textfield2" onfocus="setobj(this)">
    </td>
    <td>
      <input type="text" name="textfield3" onfocus="setobj(this)">
    </td>
  </tr>
  <tr>
    <td> 
      <input type="text" name="textfield5" onfocus="setobj(this)">
    </td>
    <td> 
      <input type="text" name="textfield6" onfocus="setobj(this)">
    </td>
    <td> 
      <input type="text" name="textfield7" onfocus="setobj(this)">
    </td>
  </tr>
</table>
</form>
用Ctrl+方向键可以方便的在控件中移动，也可以不要Ctrl的。
</body>
</HTML>
收藏本文：
【大 中 小】【打印页面】【推荐给朋友】【关闭窗口】

站长学院

推荐信息