javascript - 用户名和密码的Javascript登录页面数组不起作用

您好，我试图用javascript制作登录页面，并陷入这种情况。我以为有一个用户名和密码的数组。这是我的代码，在该代码中我无法获得如何证明用户名和相应密码的信息

塔里斯


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
    </style>
</head>
<body>
    <script src="login.js"></script>
    <input type="username" id="myText" value="">
    <input type="password" id="myText1" value="">
    <button id="button">login</button>
    <script>
     var userArray = [
         {
             username: "user1",
             password: "pw1"
         },
         {
             username: "user2",
             password: "pw2"
         },
         {
             username: "user3",
             password: "pw3"
         }
     ]


function loginFunction () {
        var username = document.getElementById("myText").value;
        var password = document.getElementById("myText1").value;

        for(i = 0; i < userArray.length; i++){
            if(username == userArray[i].username && password == userArray[i].password){
                alert("Hello");
            }

        }
}

const button = document.getElementById("button");
button.addEventListener('click', () => {
    loginFunction();
});
</script>
</body>
</html>

最佳答案

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
    </style>
</head>
<body>
    <script src="login.js"></script>
    <input type="username" id="myText" value="">
    <input type="password" id="myText1" value="">
    <button id="button">login</button>
    <script>
     var userArray = [
         {
             username: "user1",
             password: "pw1"
         },
         {
             username: "user2",
             password: "pw2"
         },
         {
             username: "user3",
             password: "pw3"
         }
     ]


function loginFunction () {
        let username = document.getElementById("myText").value;
        let password = document.getElementById("myText1").value;
  let currentUser = userArray.filter( user=> user.username == username && user.password == password)
  currentUser.length ? console.log('Hello'): console.log('Wrong data')
}

const button = document.getElementById("button");
button.addEventListener('click', () => {
    loginFunction();
});
</script>
</body>
</html>

希望这段代码对您有所帮助。如果您不懂某事，可以问我一个问题。