Question

我正在创建一个帐户创建表单并使用javascript来验证它。我希望能得到一些帮助来修复和优化它。它返回不正确的警报，并有一些其他问题。欢迎任何改进，我感谢任何建议。感谢

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Create an Accoount</title>
<script type="text/javascript">
function validateform() {
    //vars
    var username = document.forms["usercreate"]["username"].value;
    var email = document.forms["usercreate"]["email"].value;
    var pass1 = document.forms["usercreate"]["pass1"].value;
    var pass2 = document.forms["usercreate"]["pass2"].value;

    //null check
    if(username = "") {
        alert ("You forgot the user name");
        return false;
    }
    if(email = "") {
        alert ("You forgot the email address");
        return false;
    }
    if(pass1 = "") {
        alert ("You forgot a password address");
        return false;
    }
    if(pass2 = "") {
        alert ("You forgot a password address");
        return false;
    }

    if (username.length < 3 || username.length > 15) {
        alert("User name is too short (under 3) or too big (over 15)");
        return false;
    }
    if (pass1 != pass2) {
        alert ("Passwords don't match");
        return false;
    }
    if (pass1.length < 4) {
        alert ("Your is password is too short (under 4)");
        return false;
    }
    //email check
    var atpos=email.indexOf("@");
    var dotpos=email.lastIndexOf(".");
    if (atpos<1 || dotpos<atpos+2 || dotpos+2>=email.length) {
        alert("Not a valid e-mail address");
        return false;
    }
}
</script>
</head>

<body>
<h1>Account Creation</h1>
<form name="usercreate" action="usercreate.php" method="post" onsubmit="return validateform();">
<p><label for="username">Pick a user name (must be at least three letters characters)<br />
<input type="text" name="username" value="username"/><br />
<label for="email">Enter your email address:<br />
<input type="text" name="email" value="email"/><br /> <!-- check this -->
<label for="pass1">Create a password: <br />
<input type="password" name="pass1" /><br />
<label for="pass2">Retype the password:<br />
<input type="password" name="pass2" /><br />
<input type="submit" value="Create Account"/><br />
</form>
</p></body>
</html>

Answer 1

最大的问题是你使用了赋值运算符=而不是比较运算符===（或==）：

if(username = "") {

// should be

if (username === "") {

// (and similar for the other fields)

你拥有它的方式实际上是将 username更改为空字符串，然后if测试正在评估该表达式的结果，该表达式为空字符串为“falsy” “所以相应的警报永远不会显示出来。

Answer 2

尝试this

function validateform() {
//vars
var username = document.forms["usercreate"]["username"].value;
var email = document.forms["usercreate"]["email"].value;
var pass1 = document.forms["usercreate"]["pass1"].value;
var pass2 = document.forms["usercreate"]["pass2"].value;
var isFilled=true;
var msg="";
//null check
if(username == "") {
    msg+="You forgot the user name\n";
    isFilled=false;
}
if(email == "") {
    msg+="You forgot the email address\n";
    isFilled=false;
}
if(pass1 == "") {
    msg+="You forgot a password address\n";
    isFilled=false;
}
//if(pass2 == "") {
    //msg+="You forgot a password address\n";
    //isFilled=false;
//}

if (username.length < 3 || username.length > 15) {
    msg+="User name is too short (under 3) or too big (over 15)\n";
    isFilled=false;
}
if (pass1 != pass2) {
    msg+="Passwords don't match\n";
    isFilled=false;
}
if (pass1.length < 4) {
    msg+="Your is password is too short (under 4)\n";
    isFilled=false;
}
//email check
var atpos=email.indexOf("@");
var dotpos=email.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=email.length) {
    msg+="Not a valid e-mail address\n";
    isFilled=false;
}
if(!isFilled) {
    alert(msg);
}
return isFilled;

}

用户帐户的Javascript表单验证

2 个答案: