奥展项目笔记10--js实现上下键控制光标移动

html代码：

<div class="col-md-2 title">企业名称:</div>
                            <div class="col-md-4 data">
                                <input type="text" class="form-control" placeholder="请输入企业名称" value=""
                                       v-model="form.company" onkeydown="moveCursor(this,event)">
                            </div>

                            <div class="col-md-2 title">到货时间:</div>
                            <div class="col-md-4 data">
                                <input type="text" class="form-control" placeholder="请输入到货时间" value=""
                                       v-model="form.arrivetime" onkeydown=" moveCursor(this,event)">
                            </div>

                            <div class="col-md-2 title">炉号 Heat No:</div>
                            <div class="col-md-4 data">
                                <input type="text" class="form-control" placeholder="请输入炉号" value=""
                                       v-model="form.heatno" onkeydown="moveCursor(this,event)">
                            </div>

                            <div class="col-md-2 title">交货状态:</div>
                            <div class="col-md-4 data">
                                <input type="text" class="form-control" placeholder="请输入交货状态" value=""
                                       v-model="form.deliver" onkeydown="moveCursor(this,event)">
                            </div>

js代码：

//jQuery实现在一个输入框按下键后光标跳到下一个输入框
    function focusNextInput(thisInput)
    {
        let inputs = document.getElementById("inspect-part1").getElementsByTagName("input");
        for(var i = 0;i<inputs.length;i++){
            // 如果是最后一个，则焦点回到第一个(如果想实现按顺序可以登陆，可以写入登陆方法)
            if(i==(inputs.length-1)){
                inputs[0].focus(); break;
            }else if(thisInput == inputs[i]){
                inputs[i+2].focus(); break;
            }
        }

    }

    //jQuery实现在一个输入框按上键后光标跳到上一个输入框
    function focusLastInput(thisInput)
    {
        let inputs = document.getElementById("inspect-part1").getElementsByTagName("input");
        for(var i = 0;i<inputs.length;i++){
            // 如果是最后一个，则焦点回到第一个(如果想实现按顺序可以登陆，可以写入登陆方法)
            if(thisInput==inputs[0]){
                inputs[inputs.length-1].focus(); break;
            }else if(thisInput == inputs[i]){
                inputs[i-2].focus(); break;
            }
        }

    }

    function moveCursor(thisInput,event){
        var e = event || window.event || arguments.callee.caller.arguments[0];

        if(e && e.keyCode==38){//上
            console.log("hello");
            focusLastInput(thisInput);
        }
        if(e && e.keyCode==40){//下
            focusNextInput(thisInput);
        }


    }

效果图：