数字 JavaScript 的打印错误/停止表单提交

Question

问题 1：

我正在尝试创建一个简单的 javascript 函数来检查输入到字段中的所有字符是否都是数字。该功能正在运行，但不像我希望的那样。我在 javascript 中找到了 isNaN 函数，但它似乎不起作用。无论我在框中输入“asdf”还是“1234”，它每次都会输入 if 语句。

问题 2：

如果数字检查失败，我希望表单明显停止提交。但是，我希望它继续到提交页面，否则。我一直在阅读有关使用纯 JavaScript 执行此操作的方法，并按照说明实现返回。这是执行此操作的可行方法吗？替代品？

对问题 1 或 2 有任何帮助。

这是我的完整代码：

<title>Bank System</title>

<script type="text/javascript">

        function checkNumeric()
        {
                var pin = document.getElementById('pin');
                if(isNaN(pin))
                {
                        document.getElementById('message').innerHTML="Not A Valid Number";
                        return false;
                }
                else
                {
                        return true;
                }

        }




</script>

<body style="background-color: gray;">

        <h1>Welcome To Clayton's Credit Union</h1>
        </br></br>

        <form action="process.php" method="POST">
                <label>Username: <input type="text" name="username"/></label>
                </br>
                <label>Pin Number<input type="text" maxlength="4" name="pin" id="pin"/></label>
                </br></br>
                <input type="submit" value="Submit" name="submit" onClick=" return checkNumeric()"/>
                <p id="message"></p>
                </br>

        </form>

*请注意，我知道这无论如何都不安全。我专门制作这个例子来说明它是多么脆弱。

Answer 1

您将一个元素传递给isNaN，而不是它的值。试试这个：

var pin = document.getElementById('pin').value;

顺便说一句

您应该对表单提交而不是按钮单击运行此验证：

<form action="process.php" method="POST" onsubmit="return checkNumeric()">

<input type="submit" value="Submit" name="submit" />

代替：

<form action="process.php" method="POST">

<input type="submit" value="Submit" name="submit" onclick="return checkNumeric()" />