首页 技术 正文
技术 2022年11月13日
0 收藏 813 点赞 3,037 浏览 2181 个字

研究了一上午,终于做出了,实时获取本地localStorage来模拟注册登入~~~

<!DOCTYPE html>
<html>
<head lang=”en”>
<meta charset=”UTF-8″>
<title>我们虽然很穷,但是我们有梦想</title>
<script src=”angular.js”></script>
</head>
<body ng-app=”zcsApp” ng-controller=”zcsControl”>
用 户 名:<input type=”text” ng-model=”name” /><br>
密&nbsp;&nbsp;码:<input type=”text” ng-model=”pwd” /><br>
确认密码:<input type=”text” ng-model=”pwd2″ /><br>
<input type=”button” value=”注册” ng-click=” ZhuCe()”/>
<input type=”button” value=”登入” ng-click=” Enter()”/>
<span style=”color: red”>{{message}}</span>
</body>
<script>
// var data={“name”:”admin”,”pwd”:”12″};

function PersonalInfo(name,pwd){
this.name=name;
this.pwd=pwd;
}
PersonalInfo.prototype.savaLocalStorage= function () {
var storage=window.localStorage.getItem(“PersonalInfo”);//得到的数据是字符串
storage=JSON.parse(storage) ||[];//字符串转换成对象
storage.push(this);
window.localStorage.setItem(“PersonalInfo”,JSON.stringify(storage));
};
PersonalInfo.selectByName= function (name,pwd) {
var storage=window.localStorage.getItem(“PersonalInfo”);
storage= storage?JSON.parse(storage):[];
return storage.some(function (v) {//返回一个布尔值
return v.name===name&& v.pwd;
})

};
PersonalInfo.prototype.hasName= function (name,pwd,fn,fn2) {
var storage=window.localStorage.getItem(“PersonalInfo”);//得到的数据是字符串
storage= storage?JSON.parse(storage):[];
var data=storage;
for(var i=0;i<data.length;i++){
var v=data[i];
if(name!==v.name&& pwd!==v.pwd) {
fn();
return;
}
};
};
angular.module(“zcsApp”,[])
.controller(“zcsControl”,[“$scope”, function ($scope) {
$scope.ZhuCe= function () {
$scope.message=””;
var name=$scope.name;
var pwd=$scope.pwd;
var pwd2=$scope.pwd2;
// 若是输入为空或者undefined时
if(name===undefined||name.trim().length===0||pwd===undefined||pwd.trim().length===0||pwd2===undefined||pwd2.trim().length===0){
$scope.message=”请输入完整信息”;
return;
}
// 若输入的密码和确认密码不一致时
if(pwd!==pwd2){
$scope.message=”俩次输入的密码不一致”;
return;
}
// 判断本地是不是已经有这个名字
if(PersonalInfo.selectByName(name,pwd)){
$scope.message=”此账号已注册”;
return;
}
// 存储信息
var data=new PersonalInfo(name,pwd);
data.savaLocalStorage();
};
$scope.Enter= function () {
$scope.message=””;
var name=$scope.name;
var pwd=$scope.pwd;
var per=new PersonalInfo(name,pwd);
if(PersonalInfo.selectByName(name)){
$scope.message=”登入成功”;
return;
}
per.hasName(name,pwd,function () {
$scope.message=”账号错误或者密码不正确”
});//得到登入的信息
}
}])
</script>
</html>

相关推荐
python开发_常用的python模块及安装方法
adodb:我们领导推荐的数据库连接组件bsddb3:BerkeleyDB的连接组件Cheetah-1.0:我比较喜欢这个版本的cheeta…
日期:2022-11-24 点赞:878 阅读:8,907
Educational Codeforces Round 11 C. Hard Process 二分
C. Hard Process题目连接:http://www.codeforces.com/contest/660/problem/CDes…
日期:2022-11-24 点赞:807 阅读:5,432
下载Ubuntn 17.04 内核源代码
zengkefu@server1:/usr/src$ uname -aLinux server1 4.10.0-19-generic #21…
日期:2022-11-24 点赞:569 阅读:6,247
可用Active Desktop Calendar V7.86 注册码序列号
可用Active Desktop Calendar V7.86 注册码序列号Name: www.greendown.cn Code: &nb…
日期:2022-11-24 点赞:733 阅读:6,058
Android调用系统相机、自定义相机、处理大图片
Android调用系统相机和自定义相机实例本博文主要是介绍了android上使用相机进行拍照并显示的两种方式,并且由于涉及到要把拍到的照片显…
日期:2022-11-24 点赞:512 阅读:7,690
Struts的使用
一、Struts2的获取  Struts的官方网站为:http://struts.apache.org/  下载完Struts2的jar包,…
日期:2022-11-24 点赞:671 阅读:4,728