Question

我编写了以下代码，以便用户只输入数字。除了FireFox

之外，它在所有浏览器中都能正常工作

在FireFox输入数字后，如果用户点击退格，则无法正常工作。以下是代码。

    <!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>

    <script type="text/javascript">

        function getKeyCodeFromEvent(e) {
            if (typeof e == "object" && typeof e.which == "number") {
                return e.which;
            }
            return window.event.keyCode;
        }

        function checkEntry(e) {
            var keyCode = this.getKeyCodeFromEvent(e);
            var regularExpression = /^[0-9.]+$/;
            return regularExpression.test(String.fromCharCode(keyCode));
        }

    </script>
</head>
<body>
    <input type="text" onkeypress="return checkEntry(event);" />
</body>
</html>

Answer 1

当有人按下退格键时，您会从8获得值getKeyCodeFromEvent。在String.fromCharCode(8);中运行它然后返回以下unicode值：``。这与您的正则表达式不匹配，因此失败。

您可以通过检查允许退格键，删除键，制表符，左键和右键，然后将其转换为字符串值来解决此问题。您需要使用keydown事件，因为keypress不会返回某些键的值，例如左侧或右侧。

在限制这样的用户移动时要小心，因为当网站没有像他们期望的那样工作时，它可能很容易让人生气。

<script>

    function getKeyCodeFromEvent(e) {
        if (typeof e == "object" && typeof e.which == "number") {
            return e.which;
        }
        return window.event.keyCode;
    }

    function checkEntry(e) {

        var keyCode = getKeyCodeFromEvent(e);
        var regularExpression = /^[0-9.]+$/;

        // If the key is backspace, tab, left, right or delete
        if([8,9,37,39,46].indexOf(keyCode) !== -1 || e.ctrlKey || e.metaKey) {
            return true;
        }
        if(!regularExpression.test(String.fromCharCode(keyCode))) {
            e.preventDefault();
            e.returnValue = false;
            return false;
        }
    }

    // I took the liberty of moving your event from the HTML into JavaScript, where it belongs
    document.addEventListener("DOMContentLoaded", function() {
        document.getElementById('numberinput').addEventListener("keydown", checkEntry, false);
    }, false);
</script>
<input type="text" id="numberinput" />

在Firefox中验证期间退格不起作用

1 个答案: