Javascript - 保存并检索数组的登录凭据

时间:2017-08-31 11:41:11

标签: javascript html arrays html5 forms

快速查询有关保存和检索用户的凭据到数组(我还打算保存到文本文件,但暂时不是问题)。

我有一个简单的登录/注册表单,它似乎没有整体缺陷,但是当我尝试逻辑结构将注册用户的凭据保存到数组的函数时,我正在苦苦挣扎(允许多个用户的),然后和另外一个函数,它将通过数组读取登录时寻找匹配。

我对Javascript完全不熟悉,而且我不知道从哪里开始使用这些函数,或者我是如何构造/格式化数组的,所以任何帮助都会非常受欢迎。

function createUser() {}

function getUser() {}

var users = [];

表单的HTML

<div class="loginPage">
   <div name="myForm" class="form">
      <div id ="login">
         <form class="login-form" name="myForm">
            <h2>Login Page</h2>
            <input name="username" type="text" placeholder="enter username"/>
            <input name="password" type="password" placeholder="enter password"/>
            <button type="button" onclick="validateLoginForm()">login</button>
            <p class="message">Don't have an account? <a href="#register" id="register_profile">Register</a></p>
         </form>
      </div>
   </div>
</div>
<!--
   div for register back attributes, displaying form to register
   -->
<div class="registerPage">
   <div class="form">
      <div id = "register">
         <form class="register-form" name="otherForm">
            <h2>Registration Page</h2>
            <input name="username" type="text" placeholder="choose username"/>
            <input name="password" type="password" placeholder="choose password"/>
            <input name="confirmation" type="password" placeholder="re-enter password"/>
            <input name="fname" type="text" placeholder="enter first name"/>
            <input name="lname" type="text" placeholder="enter last name"/>
            <input name="email" type="text" placeholder="enter email address"/>
            <!--captcha implementation from googles re-captcha package-->
            <div class="g-recaptcha" data-sitekey="6LcMZiwUAAAAAOXbpmQMVRoWUCKt2Tyf4RrhuSr_">
            </div>
            <button type="button" onclick="validateRegisterForm()">create</button>
            <p class="message">Already have an account? <a href="#login" id="login_profile">Login</a></p>
         </form>
      </div>
   </div>
</div>

1 个答案:

答案 0 :(得分:0)

假设你确实想要这样做,这里是javascript ES6方法:

function createUser( username, password )
{
    const user = { username, password };  //create a user object to go in the array
    users.push( user );  //put it on the end of the array
}

function getUser( username, password )
{
    //loops through each user in the array and checks the stored username and password against the one you're looking for
    return users.find( eachUser => {
        return eachUser.username === username && eachUser.password === password;
    });
}

var users = [];