zoukankan      html  css  js  c++  java
  • 按回车键自动跳到下一个文本框

    文本框如下:

    <table id="table">
        <tr>
            <td><input type="text" style=" 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
         <td><input type="text" style=" 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
         <td><input type="text" style=" 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
        </tr>
       <tr>
            <td><input type="text" style=" 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
         <td><input type="text" style=" 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
         <td><input type="text" style=" 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
         </tr>
       <tr>
            <td><input type="text" style=" 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
         <td><input type="text" style=" 150px" id="text6" onkeydown="return changeTab(event,this)"></td>
         <td><input type="text" style=" 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;
    }
  • 相关阅读:
    INewPolygonFeedback接口(实时显示所画多边形的面积)
    RichTextBox追加文本信息,并根据信息的多少自动下移
    Google tile和TMS的索引算法
    出差咸阳
    失败的 炸羊排
    年中总结
    Oracle 两个表之间的数据更新
    ArcEngine下,实现图形的擦除操作(Erase操作)
    C#中使用ListView动态添加数据不闪烁(转)
    出差略阳
  • 原文地址:https://www.cnblogs.com/vipzhou/p/5000234.html
Copyright © 2011-2022 走看看