如何使用多个密码制作简单的密码页面？

发布于 2025-02-10 01:50:36 字数 1176 浏览 2 评论 0原文

我想创建一个简单的页面，用户可以在其中输入导致不同页面的不同密码。一个密码是“狗”，并通往狗页面。一个密码是“猫”，并导致猫页面等。基本上是来自一个密码字段的多个密码。

这是我到目前为止得到的：

    <!DOCTYPE html>
<html>
<head>
    <title>Login page</title>
</head>
<body>
<form>
    <label for="pswd">Enter your password: </label>
    <input type="password" id="pswd">
    <input type="button" value="Submit" onclick="checkPswd();" />
</form>
<!--Function to check password the already set password is dogs-->
<script type="text/javascript">
    function checkPswd() {
        var confirmPassword = "dogs";
        var password = document.getElementById("pswd").value;
        if (password == confirmPassword) {
             window.location="dogs.html";
        }
        else{
            alert("Passwords do not match.");
        }
    }


</script>
</body>
</html>

此代码适用于dogs.html：


<!DOCTYPE html>
<html>
<head>
    <title>Dogs page</title>
</head>
<body>
<h1>Welcome!! you entered the DOGS password</h1>
</body>
</html>

原文

I want to create a simple page where the user can type in different passwords that leads to different pages. One password is "dogs" and leads to a dog page. One password is "cats" and leads to a cats page etc. Basically multiple password from one password field.

Here's what I got so far:

    <!DOCTYPE html>
<html>
<head>
    <title>Login page</title>
</head>
<body>
<form>
    <label for="pswd">Enter your password: </label>
    <input type="password" id="pswd">
    <input type="button" value="Submit" onclick="checkPswd();" />
</form>
<!--Function to check password the already set password is dogs-->
<script type="text/javascript">
    function checkPswd() {
        var confirmPassword = "dogs";
        var password = document.getElementById("pswd").value;
        if (password == confirmPassword) {
             window.location="dogs.html";
        }
        else{
            alert("Passwords do not match.");
        }
    }


</script>
</body>
</html>

This code is for dogs.html:


<!DOCTYPE html>
<html>
<head>
    <title>Dogs page</title>
</head>
<body>
<h1>Welcome!! you entered the DOGS password</h1>
</body>
</html>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

后来的我们 2025-02-17 01:50:36

这不是您安全存储密码的方式。任何可以访问您网站的人都可以访问所有可能的密码。

这是您可能采取的好方法。您可以拥有代表每个页面/密码的对象数组。当用户输入密码时，该功能将查找与数组中匹配的对象，并将返回页面。如果不存在，您的警报将弹出。

const passwords = [
    {
        pass: "dogs",
        page: "dogs"
    },
    {
        pass: "cats",
        page: "cats"
    },
    {
        pass: "anotherpassword",
        page: "secretpage"
    }
];

function checkPswd() {
    const passInput = document.getElementById("pswd").value;
    const passMatch = passwords.find(o => o.pass === passInput);
  
    if (passMatch ) {
        console.log(`Redirecting to: "${passMatch.page}"`);
        window.location = `${passMatch.page}.html`;
    } else {
        alert("Passwords do not match.");
    }
}

This is not how you safely store passwords. Anyone that has access to your website will have access to all possible passwords.

Here is a nice way you might go about doing this. You could have an array of objects representing each page/password. When a user enters a password, the function will look for the object that matches in the array, and will return the page. If it doesn't exist, your alert will popup.

const passwords = [
    {
        pass: "dogs",
        page: "dogs"
    },
    {
        pass: "cats",
        page: "cats"
    },
    {
        pass: "anotherpassword",
        page: "secretpage"
    }
];

function checkPswd() {
    const passInput = document.getElementById("pswd").value;
    const passMatch = passwords.find(o => o.pass === passInput);
  
    if (passMatch ) {
        console.log(`Redirecting to: "${passMatch.page}"`);
        window.location = `${passMatch.page}.html`;
    } else {
        alert("Passwords do not match.");
    }
}

回复收藏 0 原文

~没有更多了~