文本框如下:
<table id="table">
<tr>
<td><input type="text" style="width: 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
<td><input type="text" style="width: 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
<td><input type="text" style="width: 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
</tr>
<tr>
<td><input type="text" style="width: 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
<td><input type="text" style="width: 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
<td><input type="text" style="width: 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
</tr>
<tr>
<td><input type="text" style="width: 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
<td><input type="text" style="width: 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
<td><input type="text" style="width: 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
</tr>
</table>
添加回车事件&方向事件(上下左右):
function changeTab(event,i){
var keyCode = event.keyCode;
var inputs = jQuery("#table :input"); // 获取表单中的所有输入框
var idx = inputs.index(i);
switch(keyCode){
case 13:
inputs[idx + 3].focus(); // 设置焦点
inputs[idx + 3].select(); // 选中
break;
case 37: //←
inputs[idx - 1].focus(); // 设置焦点
inputs[idx - 1].select(); // 选中
break;
case 38: //↑
inputs[idx - 3].focus(); // 设置焦点
inputs[idx - 3].select(); // 选中
break;
case 39: //→
inputs[idx + 1].focus(); // 设置焦点
inputs[idx + 1].select(); // 选中
break;
case 40: //↓
inputs[idx + 3].focus(); // 设置焦点
inputs[idx + 3].select(); // 选中
break;
default:
break;
}
return true;
}