如何验证登录表单Javascript的功能？

2024-05-03 • 问答

我正在尝试创建一个功能，以验证本地存储中的用户名和密码，并将用户重定向到另一个HTML页面。自动取款机，当我单击我的“登录”按钮时，什么也没有发生，甚至没有错误。有任何想法吗？

//Users
class userLogin{
    constructor(username,password,authLevel){
        this.username = username;
        this.password = password;
        this.authlevel = authLevel;
    }
}
// Localstorage logins
if(localStorage.getItem("userLogin") == null){
    var userLogins = [];
    userLogins.push(new userLogin("Benjamin",4321,"1" ));
    userLogins.push(new userLogin("Mads",12345,"1"));
    userLogins.push(new userLogin("Simon",1234,"1"));
    userLogins.push(new userLogin("jessica",54321,"1"));
    // Logins for Projectmanagers
    userLogins.push(new userLogin("Oliver","2"));
    userLogins.push(new userLogin("Sara","2"));

    var userLoginstring = JSON.stringify(userLogin)
    localStorage.setItem("userLogin",userLoginstring)
} else {
    var employeeList = JSON.parse(localStorage.getItem("userLogin"))

}
var uname = document.getElementById("uname");
var pass = document.getElementById("pass");

function validate() {
    var userLogins = JSON.parse(localStorage.getItem(userLogin));
    if (!userLogins) {
        userLogins = [
            //Logins for Employee
            new userLogin("Benjamin","1" ),new userLogin("Mads","1"),new userLogin("Simon",new userLogin("jessica",// Logins for Projectmanagers
            new userLogin("Oliver","2"),new userLogin("Sara",];
        localStorage.setItem("userLogin",JSON.stringify(userLogins));

        for (let i = 0; i < userLogin.length; i++){
            if (uname.value == userLogin && pass.value == userLogin){
                alert("You have been logged in");
                document.location = "Employeesite.html";
                return false
            }
        }
    }
}

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Eksamensprojekt</title>
    <link rel="stylesheet" type="text/css" href="styles.css">
</head>

<body>
<h2>Welcome to EPM!</h2>
<form id="form_id">
    <div class="image">
        <img src="EPM.png" alt="Logo" class="logo"><x></x>
    </div>
    <div class="container">
        <label for="uname"><b>Username</b></label>
        <input type="text" placeholder="Enter Username" id="uname" value="">

        <label for="pass"><b>Password</b></label>
        <input type="password" placeholder="Enter Password" id="pass" value="">

        <button type="button" value="Login" onclick="validate()">Login</button>
    </div>
</form>
</div>
<script src="Login.js"></script>
<script src="Users.js"></script>
</body>
</html>

if (uname.value == userLogin[i].username  && pass.value == userLogin[i].password )

注意上面的代码块。

 //Users
    class userLogin{
        constructor(username,password,authLevel){
            this.username = username;
            this.password = password;
            this.authlevel = authLevel;
        }
    }
    // Localstorage logins
    if(localStorage.getItem("userLogin") == null){
        var userLogins = [];
        userLogins.push(new userLogin("Benjamin",4321,"1" ));
        userLogins.push(new userLogin("Mads",12345,"1"));
        userLogins.push(new userLogin("Simon",1234,"1"));
        userLogins.push(new userLogin("Jessica",54321,"1"));
        // Logins for Projectmanagers
        userLogins.push(new userLogin("Oliver","2"));
        userLogins.push(new userLogin("Sara","2"));

        var userLoginstring = JSON.stringify(userLogin)
        localStorage.setItem("userLogin",userLoginstring)
    } else {
        var employeeList = JSON.parse(localStorage.getItem("userLogin"))

    }
    var uname = document.getElementById("uname");
    var pass = document.getElementById("pass");

    function validate() {
        var userLogins = JSON.parse(localStorage.getItem(userLogin));
        if (!userLogins) {
            userLogins = [
                //Logins for Employee
                new userLogin("Benjamin","1" ),new userLogin("Mads","1"),new userLogin("Simon",new userLogin("Jessica",// Logins for Projectmanagers
                new userLogin("Oliver","2"),new userLogin("Sara",];
            localStorage.setItem("userLogin",JSON.stringify(userLogins));

            for (let i = 0; i < userLogin.length; i++){
                if (uname.value == userLogin[i].username  && pass.value == userLogin[i].password ){
                    alert("You have been logged in");
                    document.location = "Employeesite.html";
                    return false
                }
            }
        }
    }

如何验证登录表单Javascript的功能？

bbyyk 回答：如何验证登录表单Javascript的功能？

大家都在问