Question

嘿我正在使用表格

<form action="" method="post">
<p>Enter Roll Number:
<input type="text" name="roll" maxlength="6" placeholder="123456" size="7"/>
</p>
<p>
<input type="submit" value="Submit" />
</p>
</form>

从用户那里获取输入（卷号）我希望在Key Press事件中，用户只能在0-9和Delete和Backspace以及TAB按钮之间键入。所有其他密钥必须受限于键入。还有一件事，如果该字段为空，则不应发布表单。

Answer 1

假设您将使用jQuery，因为它可能是实现此类事情的最简单的语法。

<script>
    $(document).ready(function() {
        $('input[name="roll"]').keypress(function(e) {
            // Check out which keys are pressed
            switch(e.keyCode) {
                case 8: //backspace
                case 9: // TAB
                case 46: // delete
                case 48: // 0
                case 49: // 1
                case 50: // 2
                case 51: // 3
                case 52: // 4
                case 53: // 5
                case 54: // 6
                case 55: // 7
                case 56: // 8
                case 57: // 9
                case 96: // numberpad = 0
                case 97: // numberpad = 1
                case 98: // numberpad = 2
                case 99: // numberpad = 3
                case 100: // numberpad = 4
                case 101: // numberpad = 5
                case 102: // numberpad = 6
                case 103: // numberpad = 7
                case 104: // numberpad = 8
                case 105: // numberpad = 9
                    break;
                default:
                    return false;
            }
        });
    });
</script>

以下是working example

Answer 2

这里是关键按键和表单提交的JS代码

<script>
    $(document).ready(function() {
        $('input[name="roll"]').keypress(function(e) {
            // Check out which keys are pressed
            if(e.keyCode == 8 || e.keyCode == 8 || e.keyCode == 46 || (e.keyCode >= 48 && e.keyCode <= 57) || (e.keyCode >= 96 && e.keyCode <= 105)) {
                   return true;
            } else {
                   return false;
            }
        });

    });

    function checkvalid() {
        if($('#roll').val() != '') {
           $('#frmid').submit();
        } else {
           return false;
        }
    }
</script>

此处为HTML代码

<form action="" method="post" id="frmid" name="frmid" onsubmit="checkvalid();">
<p>Enter Roll Number:
<input type="text" name="roll" id="roll" maxlength="6" placeholder="123456" size="7"/>
</p>
<p>
<input type="submit" value="Submit" id="submit_btn" />
</p>
</form>

在不刷新的情况下限制HTML中文本字段的输入

2 个答案: