Question

我目前正在进行javascript验证，除了我的年龄验证外，一切都运行良好。如果此人输入字符串类型的值，则必须提醒用户输入他/她的年龄作为数值...

我不太清楚如何解决这个问题，所以非常感谢你的帮助！

您将在if语句的validAge函数中看到我正在尝试做的事情：第55行

这是我到目前为止的代码！

<!DOCTYPE HTML>
<html>
<head>
    <title>Question 1 / Vraag 1 - Basic JavaScript Validaton / Basiese JavaScript validasie
    </title>
    <link rel="Stylesheet" type="text/css" href="style.css" />
        <script language="javascript">

                function validate()
                {
                    var firstname = document.getElementById("firstname");
                    var surname = document.getElementById("surname");
                    var age = document.getElementById("age");
                    var email = document.getElementById("email");

                    if(notEmpty(firstname, "ENTER USERNAME"))
                    {
                        if(notEmpty(surname, "ENTER SURNAME"))
                        {
                            if(notEmpty(age, "ENTER AGE"))
                            {
                                if(validAge(age, "AGE MUST BE A NUMERIC VALUE"))
                                {
                                    if(notEmpty(email, "ENTER EMAIL"))
                                    {
                                        if(emailValid(email, "ENTER A PROPER EMAIL ADDRESS"))
                                        {
                                            return emailValid();
                                        }
                                    }
                                }
                            }
                        }
                    }
                    return false;
                }

                function notEmpty(elem, helperMsg)
                {
                    if(elem.value.length == 0)
                    {
                        alert(helperMsg);
                        elem.focus();
                        return false;
                    }

                    return true;
                }


                function validAge(elem, helperMsg)
                {
                    var age = elem.value;

                    if(age <= 0 || age > 100 || age.type == string???))
                    {
                        alert(helperMsg);
                        return false;
                    }

                    return true;
                }


                function emailValid(elem, helperMsg)
                {
                    var atpos = elem.value.indexOf("@");
                    var dotpos = elem.value.lastIndexOf(".");

                    if(atpos < 0 || dotpos < 0)
                    {
                        alert(helperMsg);
                        return false;
                    }

                    return true;
                }

        </script>
</head>
<body>
    <form method="get" action="">
    <table>
    <tr>
    <td> Firstname:</td>
    <td> <input type="text" name="firstname" id="firstname" /><span id="fnError">
        </span></td>
    </tr>
    <tr>
    <td> Surname:</td>
    <td> <input type="text" name="surname" id="surname"/><span id="snError">
        </span></td>
    </tr>
    <tr>
    <td> Age:</td>
    <td> <input type="text" name="age" id="age"/><span id="aError">
        </span></td>
    </tr>
    <tr>
    <td>  Email:</td>
    <td><input type="text" name="email" id="email"/><span id="eError">
        </span></td>
    </tr>
    <tr><td colspan="2"><input type="button" value="Validate" onClick="validate()" /></td></tr>
    </table>
    </form>
</body>
</html>

Answer 1

使用RegExp检查它是否有效。像isNaN这样的方法仍会允许浮点数，但我从未听过有人说 My age is twelve dot three 。：

    function validAge(elem, helperMsg)
    {
        var age = elem.value;
       //Two digits, so anything between and including 0 and 99
        if(/^\d{1,2}$/,test(age)) 
        {
            alert(helperMsg);
            return false;
        }

        return true;
    }

另一个提示：您也可以使用逻辑if（AND）运算符，而不是嵌套数百个&&条件。

if(a){
  if(b){
    if(c){
       ...

可缩短为：

if(a && B && c){

Answer 2

您可以使用isNan功能！

Answer 3

我认为这就是你想要的：

if(isNaN(age) || age <= 0 || age > 100))

isNaN(age)使用isNaN^[MDN]函数检查age是否实际上是一个数字。

请注意，这将允许浮点年龄，这可能是您想要的，也可能不是。如果您愿意，您只能允许具有以下条件的整数年龄：

age % 1 === 0

另外，我会避免嵌套所有if语句。你可以在每一个之后做一个回报，如下所示：

if(notEmpty(firstname, "ENTER USERNAME")) return false;
if(notEmpty(surname, "ENTER SURNAME")) return false;
if(notEmpty(age, "ENTER AGE")) return false;
/// skip a few ...
return emailValid();

顺便说一下，有些人已经超过100岁了。这个应用程序对他们的用户体验不利。

Answer 4

使用isNaN()：

尝试此操作

  function validAge(elem, helperMsg)
  {
       var age = elem.value;
       // If age is Not a Number,  not at least 1, greater than 100,  or has a decimal place.

       if(isNaN(age) || age <= 0 || age > 100 || age.indexOf(".") >= 0)
       {
              alert(helperMsg);
              return false;
       }

       return true;
  }

Answer 5

以上所有答案都是正确的。如果您考虑重新使用，请查看此plugin。它可以轻松验证表单。

Answer 6

<html>
<head>
<title>Name</title>
<script>
function validatetext()
{
    if(document.sign.fname.value=="")
    {
        alert("Missing First name!");
    }
    if(isNaN(document.sign.age())
    {
        alert("Enter numaric");
    }
}
</script>
</head>
<body><form method=post name="sign">
<b>name:</b>
<input name="fname" type="text" size="30" maxlength="30" />
<br>
<b>age:</b>
<input name="age" type="text" size="30" maxlength="30" />
<input type="submit" name="signup"  value="sign up" onclick="validatetext();" />
</form>
</body>
</html>

Javascript年龄验证

6 个答案: