js控制光标上下移动

最新推荐文章于 2024-08-12 14:11:38 发布

祥灬子

最新推荐文章于 2024-08-12 14:11:38 发布

阅读量2.9k

点赞数

分类专栏： js web 文章标签： javascript web

本文链接：https://blog.csdn.net/qq_17505335/article/details/51787684

版权

web 同时被 2 个专栏收录

19 篇文章 0 订阅

订阅专栏

14 篇文章 0 订阅

订阅专栏

<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 key;
function setobj(input){
obj=input;
}

function init(){
document.οnkeydοwn=keyDown;
document.οnkeyup=keyUp;
}

//按键
function keyDown(DnEvents){

key=window.event.keyCode;

//f5键
if(key==116){
//取消按键
window.event.keyCode=0;
return false;
}

//backplace
if(key==8){
//触发事件的控件既不是 <input />,该语句值在IE里有效
if(event.srcElement.tagName!="INPUT"){
//可以停止事件继续上传
event.cancelBubble = true;
//取消事件默认行为
event.returnValue = false;
return false;
}
}

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 < 2*cols -1){
document.forms[0].elements[i + 1].focus();
key = 0;
}
}

//下键
if (key == 40){//↓
if(i< cols){
document.forms[0].elements[cols + i].focus();
}
}
}
}

}

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

<body bgcolor="#FFFFFF" text="#000000" οnlοad="init()">
<form>
<table border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td>
<input type="text" name="textfield" οnfοcus="setobj(this)">
</td>
<td>
<input type="text" name="textfield2" οnfοcus="setobj(this)">
</td>
<td>
<input type="text" name="textfield3" οnfοcus="setobj(this)">
</td>
</tr>
<tr>
<td>
<input type="text" name="textfield5" οnfοcus="setobj(this)">
</td>
<td>
<input type="text" name="textfield6" οnfοcus="setobj(this)">
</td>
<td>
<input type="text" name="textfield7" οnfοcus="setobj(this)">
</td>
</tr>
</table>
</form>
</body>
</html>