您的位置：首页 > 其它

web储存用户信息

2017-01-11 10:53 218 查看

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
</head>

<body>
<form>
昵称：<input type="text" id="username"><br><br> 密码：
<input type="password" id="password"><br><br>
<input type="button" value="登录" id="login">
<input type="button" value="注册" id="resiger">
<input type="button" value="clear" id="clear">
</form>
<script type="text/javascript">
//需求分析：把获取的用户名和密码存入本地存储中
//当用户登陆的时候判断用户名和密码是否在存储中
//我认为应该这样存储用户名和密码
//userpass:[{username:zhangsan,password:123456},{username:lisi,password:123456}]
var login = document.getElementById("login");
var resiger = document.getElementById("resiger");
var user = document.getElementById("username");
var pass = document.getElementById("password");
var clear = document.getElementById("clear");
//开始的时候获取本地存储，如果没有，置为[],否则获取
var str = window.localStorage.getItem("userpass") || "[]";
var userpass = JSON.parse(str);
//注册功能实现
resiger.onclick = function() {
//非空判断
var person = {
username: user.value,
password: pass.value
};
//需要判定用户名是否重复，如果重复，提示该用户名已被注册，并且return
//如果没有重复，就把他放入数组中
userpass.push(person);
console.log(userpass);
var str = JSON.stringify(userpass)
window.localStorage.setItem("userpass", str);
}
//登陆功能实现
login.onclick = function() {
var username = user.value;
var password = pass.value;
var flag = 0;
for(var i = 0; i < userpass.length; i++) {
if(username == userpass[i].username && password == userpass[i].password) {
alert("欢迎" + username + ",登陆成功！");
return;
} else {
flag++;
}
}
if(flag == userpass.length) {
alert("登陆不成功");
}
}
clear.addEventListener('click',function(){
window.localStorage.clear();
})
</script>
</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航