登录函数JavaScript_Javascript_Html

登录函数JavaScript

javascript html

登录函数JavaScript,javascript,html,Javascript,Html,我在创建登录验证函数时遇到困难，该函数将从本地存储中的硬编码用户进行验证。我的想法是将两种不同类型的用户（因此是身份验证级别构造函数）重定向到不同的html页面。现在我甚至不能重定向到一个页面，当我点击我的“登录”按钮时什么也没有发生。你知道我做错了什么吗？：） //用户类userLogin{ 构造函数（用户名、密码、身份验证级别）{ this.username=用户名； this.password=密码； this.authlevel=authlevel； } } //本地存储登录 if（

我在创建登录验证函数时遇到困难，该函数将从本地存储中的硬编码用户进行验证。我的想法是将两种不同类型的用户（因此是身份验证级别构造函数）重定向到不同的html页面。现在我甚至不能重定向到一个页面，当我点击我的“登录”按钮时什么也没有发生。你知道我做错了什么吗？：）

//用户
类userLogin{
构造函数（用户名、密码、身份验证级别）{
this.username=用户名；
this.password=密码；
this.authlevel=authlevel；
}
}
//本地存储登录
if（localStorage.getItem（“userLogin”）==null）{
var userLogins=[]；
推送（新用户登录（“Benjamin”，4321，“1”）；
推送（新用户登录（“Mads”，12345，“1”）；
推送（新用户登录（“Simon”，1234，“1”））；
推送（新用户登录（“Jessica”，54321，“1”）；
//项目经理的登录
推送（新用户登录（“Oliver”，1234，“2”）；
push（新用户登录（“Sara”，4321，“2”）；
var userLoginstring=JSON.stringify（“userLogin”）
setItem（“userLogin”，userLoginstring）
}否则{
}
var employeeList=JSON.parse（localStorage.getItem（“userLogin”））
//登录验证
var uname=document.getElementById（“uname”）；
var pass=document.getElementById（“pass”）；
函数验证（）{
var userLogins=JSON.parse（localStorage.getItem（“userLogin”）；
如果（！userLogins）{
用户登录=[
//员工登录
新用户登录（“Benjamin”，4321，“1”），
新用户登录（“Mads”，12345，“1”），
新用户登录（“Simon”，1234，“1”），
新用户登录（“Jessica”，54321，“1”），
//项目经理的登录
新用户登录（“Oliver”，1234，“2”），
新用户登录（“Sara”，4321，“2”），
];
setItem（“userLogin”，JSON.stringify（userLogins））；
for（设i=0；i


HTML
<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>


Eksamensprojekt
欢迎来到EPM！
用户名
密码
登录
我在示例中找出了两个主要问题，以下是我的发现。使用此代码，它应该可以工作
在您提供的示例中，只有在没有用户登录时才会触发代码（可能if语句括号放在了错误的位置？）
在指令中，如果（uname.value==userLogins[i]）
将一个值与UserLogin类型的对象进行比较，则该值不能相等。也许您需要将其与userLogins[i]进行比较。是否改为username
函数验证（）{
var userLogins=JSON.parse（localStorage.getItem（“userLogin”）；
如果（！userLogins）{
用户登录=[
//员工登录
新用户登录（“Benjamin”，4321，“1”），
新用户登录（“Mads”，12345，“1”），
新用户登录（“Simon”，1234，“1”），
新用户登录（“Jessica”，54321，“1”），
//项目经理的登录
新用户登录（“Oliver”，1234，“2”），
新用户登录（“Sara”，4321，“2”）
];
setItem（“userLogin”，JSON.stringify（userLogins））；
}
for（设i=0；i
告诉我们如何实际调用此代码JSON.stringify（“userLogin”）
应该是JSON.stringify（userLogins）仍然有相同的问题：p
<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>

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

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