用戶帳戶的JavaScript表單驗證

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

試試這個

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 個解決方案

解決方案1
1 2012-03-03 03:42:50

解決方案2
0 2012-03-03 04:02:59

用戶帳戶的JavaScript表單驗證

問題描述

2 個解決方案

解決方案1 1 2012-03-03 03:42:50

解決方案2 0 2012-03-03 04:02:59

解決方案1
1 2012-03-03 03:42:50

解決方案2
0 2012-03-03 04:02:59