input框输入一个数字按回车自动跳转下一个input框

更新时间:2024/6/2 18:32:01点击: 技术文章

 <!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
</head>
<body>
    <form name=card action="" method=post>
        <input onkeydown="T1_onkeyup()" maxLength=1 name=T1>
        <input onkeydown="T2_onkeyup()" maxLength=1 name=T2>
        <input onkeydown="T3_onkeyup()" maxLength=1 name=T3>
        <input onkeydown="T4_onkeyup()" maxLength=1 name=T4>
    </form>

    <script>
        function T1_onkeyup() {
            if (document.card.T1.value.length == 1) {
                document.card.T2.focus();
            }
        }
        function T2_onkeyup() {
            var oEvent = window.event;
            if (oEvent.keyCode == 8 && document.card.T2.value.length == 0) {
                document.card.T1.focus();
            }
            if (document.card.T2.value.length == 1) {
                document.card.T3.focus();
            }
        }

        function T3_onkeyup() {
            var oEvent = window.event;
            if (oEvent.keyCode == 8 && document.card.T3.value.length == 0) {
                document.card.T2.focus();
            }
            if (document.card.T3.value.length == 1) {
                document.card.T4.focus();
            }
        }
        function T4_onkeyup() {
            var oEvent = window.event;
            if (oEvent.keyCode == 8 && document.card.T4.value.length == 0) {
                document.card.T3.focus();
            }
        }
    </script>
</body>
</html>