经过几个小时的研究,我仍然没有找到如何在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'));
但是不幸的是,我找不到任何想法。我知道在客户端存储敏感数据不是一个好主意,但这只是出于学习目的。
谢谢
答案 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>