文本框如下:

<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;
}

 

相关文章:

  • 2022-02-16
  • 2021-06-23
  • 2022-01-06
  • 2022-12-23
  • 2021-09-20
  • 2021-06-26
猜你喜欢
  • 2021-09-12
  • 2022-12-23
  • 2022-12-23
  • 2022-01-20
  • 2022-12-23
  • 2021-12-01
相关资源
相似解决方案