哪位能说一下怎么在htm页面中完全用键盘操作完成各文本框、下拉框等输入数据的操作，要求不用TAB，用方向键可自由移动光标到各文本框

看一下以下程序：为什么当文本输入框数目大于10以后，光标就不能上下移动？我怎么改都不行。<form name="form1" method="post" action="">
  <p> (1)
    <input type="text" name="d1" onkeydown="test(this)">
  </p>
  <p> (2)
    <input type="text" name="d2" onkeydown="test(this)">
  </p>
  <p> (3)
    <input type="text" name="d3" onkeydown="test(this)">
  </p>
  <p> (4)
    <input type="text" name="d4" onkeydown="test(this)">
  </p>
  <p> (5)
    <input type="text" name="d5" onkeydown="test(this)">
<p> (6)
    <input type="text" name="d6" onkeydown="test(this)">
<p> (7)
    <input type="text" name="d7" onkeydown="test(this)">
<p> (8)
    <input type="text" name="d8" onkeydown="test(this)">
<p> (9)
    <input type="text" name="d9" onkeydown="test(this)">
<p> (10)
    <input type="text" name="d10" onkeydown="test(this)">  </p>
</form>
<script>
function test(obj)
{
if(event.keyCode == 38)
{
var id = window.event.srcElement.name
id = id.substr(1,1)
id = parseInt(id) - 1
if(id < 1) id = 10
eval("document.form1.d" + id + ".focus()")
}
if(event.keyCode == 40)
{
var id = window.event.srcElement.name
id = id.substr(1,1)
id = parseInt(id) + 1
if(id > 10) id = 1
eval("document.form1.d" + id + ".focus()")
}
}
</script>
我也正在找。

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

请关注一下这个问题：
http://www.csdn.net/expert/topic/791/791061.xml?temp=.4830286
if(id > 10) id = 1
明显是这一句在捣乱嘛，难道你没看出来？大于10了就回去到1
http://colorweb.go.163.com/js/index.html
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script language="javascript">
var cols=4;
var obj;
var CanMove=false;
var key;
function setobj(input){
obj=input;//捕获当前控件对象；
}//初始化，用KeyDown和KeyUp方法改写原来的onkeydown和onkeyup方法；
function init(){
document.onkeydown=keyDown;
document.onkeyup=keyUp;
}
function keyDown(DnEvents){
var key=window.event.keyCode;
if(key==116){
window.event.keyCode=0;//屏蔽F5(刷新)键；
return false;
}
if(key==8){
if(event.srcElement.tagName!="INPUT"){
event.cancelBubble = true;//如果控件当前类型为“input”，屏蔽退格键；
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<document.forms[0].elements.length-1){
document.forms[0].elements[i+1].focus();
}
}
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>
      <select name="textfield2" onfocus="setobj(this)">
<option>1
<option>2
</select>
    </td>
    <td>
      <input type="text" name="textfield3" onfocus="setobj(this)">
    </td>
    <td>
      <input type="text" name="textfield4" 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>
    <td>
      <input type="text" name="textfield8" onfocus="setobj(this)">
    </td>
  </tr>
</table>
</form>
</body>
</html>
seabell(百合心) 这个不错，但在使用下拉框时还是有问题，不方便，还有有checkbox这样的怎么办呢
没有刁难呀，有些问题很现实的，比如seabell写的实现了用方向标控制，但要对一个文本框中内容编辑时用光标又不方便了，这个不知道有没有好办法，还有在出现radio时也不好办
IE有bug，用箭头键可以把焦点转到隐藏的元素上的，而且就堵在那里过不去：
<html>
<body>
<input type=radio name="t">
<input type=radio name="t" onclick="alert()" style="display:none">
<input type=radio name="t">
</body>
</html>
那就不如这样
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script language="javascript">
var cols=4;
var obj;
var CanMove=false;
var key;
function setobj(input){
obj=input;//捕获当前控件对象；
}//初始化，用KeyDown和KeyUp方法改写原来的onkeydown和onkeyup方法；
function init(){
document.onkeydown=keyDown;
document.onkeyup=keyUp;
}
function keyDown(DnEvents){
var key=window.event.keyCode;
if(key==116){
window.event.keyCode=0;//屏蔽F5(刷新)键；
return false;
}
if(key==8){
if(event.srcElement.tagName!="INPUT"){
event.cancelBubble = true;//如果控件当前类型为“input”，屏蔽退格键；
event.returnValue = false;
return false;
}
}
//在按下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 == 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>
    <td>
      <input type="text" name="textfield4" 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>
    <td>
      <input type="text" name="textfield8" onfocus="setobj(this)">
    </td>
  </tr>
</table>
</form>
用Ctrl+方向键可以方便的在控件中移动
</body>
</html>
不明白你的意思，这样有什么问题么
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script language="javascript">
var cols=4;
var obj;
var CanMove=false;
var key;
function setobj(input){
obj=input;//捕获当前控件对象；
}//初始化，用KeyDown和KeyUp方法改写原来的onkeydown和onkeyup方法；
function init(){
document.onkeydown=keyDown;
document.onkeyup=keyUp;
}
function keyDown(DnEvents){
var key=window.event.keyCode;
if(key==116){
window.event.keyCode=0;//屏蔽F5(刷新)键；
return false;
}
if(key==8){
if(event.srcElement.tagName!="INPUT"){
event.cancelBubble = true;//如果控件当前类型为“input”，屏蔽退格键；
event.returnValue = false;
return false;
}
}
//在按下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 == 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>
      <select name="textfield2" onfocus="setobj(this)">
<option>1
<option>2
</select>
    </td>
    <td>
      <input type="radio" name="textfield3" onfocus="setobj(this)">radio
    </td>
    <td>
      <input type="radio" name="textfield3" onfocus="setobj(this)">radio
    </td>
  </tr>
  <tr>
    <td>
      <input type="text" name="textfield5" onfocus="setobj(this)">
    </td>
    <td>
      <input type="checkbox" name="check1" onfocus="setobj(this)">check1
    </td>
    <td>
      <input type="checkbox" name="check2" onfocus="setobj(this)">check2
    </td>
    <td>
      <input type="text" name="textfield8" onfocus="setobj(this)">
    </td>
  </tr>
</table>
</form>
用Ctrl+方向键可以方便的在控件中移动
</body>
</html>