用户和新用户的localStorage(学习目的)

时间:2018-12-11 20:29:48

标签: javascript html local-storage

经过几个小时的研究,我仍然没有找到如何在localStorage中存储新用户的方法。

我有2页,如下所示:1个用于登录,1个用于注册:

<div class="login-page">
<div class="form">
<form class="register-form">
<input type="text" placeholder="name"/>
<input type="password" placeholder="password"/>
<input type="text" placeholder="email id"/>
<button>Create</button>
<p class="message">Already Registered? <a href="#">Login</a></p>
</form>


<form class="login-form">
<input type="text" placeholder="user name"/>
<input type="password" placeholder="password"/>
<button>login</button>
<p class="message">Not registered? <a href="#"> Register </a></p>
</div>
</div>

现在,我正试图将新注册的用户(以便使用它们进行登录)存储到localStorage中,

userData = {
    firstName: 'John',
    lastName: 'Smith',
    email: 'admin@gmail.com',
    password: '123456789'
},
adminData;



localStorage.setItem('userData', JSON.stringify(userData));
adminData = JSON.parse(localStorage.getItem('userData'));

但是不幸的是,我找不到任何想法。我知道在客户端存储敏感数据不是一个好主意,但这只是出于学习目的。

谢谢

1 个答案:

答案 0 :(得分:0)

您所做的是正确的,但是要检查变量值,请尝试警报而不是控制台,因为我认为您无法正确看到数据,甚至您也可以转到“开发人员工具”的“应用程序”选项卡。 而且,如果您可以共享完整的代码,也许我可以为您提供帮助。

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <div class="login-page">
      <div class="form">
        <form class="register-form">
          <input id="username" type="text" placeholder="name"/>
          <input id="passcode" type="password" placeholder="password"/>
          <input id="email" type="text" placeholder="email id"/>
          <button onclick="addToLocal()">Create</button>
          <p class="message">Already Registered? <a href="#">Login</a></p>
        </form>

        <form class="login-form">
          <input type="text" placeholder="user name"/>
          <input type="password" placeholder="password"/>
          <button>login</button>
          <p class="message">Not registered? <a href="#"> Register </a></p>
        </form>
      </div>
    </div>
  <script>
    function addToLocal() {
      var username = document.getElementById('username').value;
      var passcode = document.getElementById('passcode').value;
      var emailAddress = document.getElementById('email').value;
      var userDetails = {
        "username": username,
        "passcode": passcode,
        "emailAddress": emailAddress,
      }
      localStorage.setItem("userDetails", JSON.stringify(userDetails));
    }
  </script>
  </body>
</html>