Jquery输入框定义回车快捷键

最新推荐文章于 2024-04-10 17:13:41 发布

原创最新推荐文章于 2024-04-10 17:13:41 发布 · 358 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#jquery #前端 #javascript

Jquery、CSS 专栏收录该内容

8 篇文章

订阅专栏

这篇文章介绍了JavaScript函数`focusNextInput`，它用于处理表单中的输入框，当用户按Enter键时，自动将焦点移动到下一个可用的非隐藏输入框。该函数适用于处理表单提交过程中的焦点流转。

 function focusNextInput(thisInput) {
        var inputs = document.getElementsByTagName("input");
        var isNext = false;
        for (var i = 0; i < inputs.length; i++) {
            // 如果是最后一个，则焦点回到第一个 
            if (i == (inputs.length - 1)) {
                inputs[0].focus();
                inputs[0].select();
                break;
            } else if (thisInput == inputs[i]) {
                if (inputs[i + 1].readOnly || inputs[i + 1].type == "hidden") {
                    isNext = true;
                } else {
                    inputs[i + 1].focus();
                    inputs[i + 1].select();
                    break; //不加最后一行eles就直接回到第一个输入框
                }
            } else { //最后的eles是添加的表单提交方法(如果想实现登陆，可以写入登陆方法)
                //document.getElementById("form1").submit(); //直接form提交
                if (isNext) {
                    if (inputs[i + 1].readOnly || inputs[i + 1].type == "hidden") {
                    } else {
                        inputs[i + 1].focus();
                        inputs[i + 1].select();
                        break;
                    }
                }
            }
        }
    }
//回车触发函数
$("input").keydown(function (event) {
    if (event.keyCode == 13) {
        var objButton = this;
        focusNextInput(objButton);
    }
})