淘淘商城系列——单点登录之用户注册页面实现
来源:互联网 发布:图论与网络优化 pdf 编辑:程序博客网 时间:2024/06/06 03:18
首先,我们还是先看一下注册页面,如下图所示。
上图箭头指向的链接在register.jsp的代码当中的位置如下图所示。
由于我现在对js不是很熟悉,注册页面对输入合法性的校验就不像正规网站那种校验方式了,我只是在点击”立即注册”的时候统一做下校验,如果不合法就弹出一个alert警告框(注意:实际工作中是绝不允许用alert来提示校验信息的,js好的同学可以自己把校验这块完善一下)。点击”立即注册”触发的方法是”REGISTER.reg()”,这个REGISTER对象是js定义的,如下图所示。
REGISTER对象的reg方法在js代码的最下方,如下图所示,可以看到它会先去调用inputcheck()方法判断文本框是否为空以及密码是否一致。
inputcheck方法的代码如下图所示。
判断完用户名、密码、手机号不能为空及两次密码输入一致之后,在提交之前,我们还需要判断一下用户名和手机号是否已经注册过了,如果用户名和手机号都没有被注册过,那么就允许注册,调用REGISTER.doSubmit()方法,doSubmit方法中调用了注册接口,如下图所示。由于检查用户名、手机号的接口以及注册的接口我们都已经写好了,因此直接调用即可。另外说一点就是,url : REGISTER.param.surl + "/user/check/"+escape($("#regName").val())+"/1?r=" + Math.random(),
这句代码中的Math.random()的作用是每次提交请求都是新的请求,避免浏览器缓存的影响。在doSubmit方法中有个参数是$("#personRegForm").serialize()
,它的作用是将表单进行序列化,转换成key-value形式的字符串。
好了,看了register.jsp页面的代码后,我们现在来测试下注册功能,我们在注册页面输入没有注册过的用户名和手机号,然后点击”立即注册”,会看到弹出”用户注册成功”的提示信息,我们点击弹出框中的”确定”按钮。
点”确定”按钮后,页面会自动跳转到登录页面,如下图所示。
这样,我们的用户注册页面便实现了。
- 淘淘商城系列——单点登录之用户注册页面实现
- 淘淘商城系列——单点登录之用户注册
- 淘淘商城系列——单点登录之用户登录页面实现
- 淘淘商城系列——单点登录之注册页面与登录页面的展示
- 淘淘商城系列——单点登录之用户登录
- 淘淘商城系列——单点登录之安全退出
- 淘淘商城系列——单点登录接口文档分析
- 学习淘淘商城第八十六课(单点登录用户注册Controller层实现及测试)
- 淘淘商城系列——单点登录之通过token获取用户信息
- 淘淘商城系列——利用拦截器实现登录功能及订单确认页面展示
- 淘淘商城系列——实现商品详情页面展示
- 淘淘商城系列——单点登录检查数据是否可用
- 学习淘淘商城第八十五课(单点登录用户注册--Service层)
- 学习淘淘商城第九十一课(单点登录、注册页面展示)
- 学习淘淘商城第九十二课(用户注册页面实现)
- 淘淘商城系列——展示后台管理页面
- 淘淘商城系列——首页跳转到搜索页面
- 淘淘商城系列——商品类目选择的实现
- Mysql索引类型
- springboot中用RestTemplate调用百度ip定位服务
- ptmalloc
- 1.管理的含义
- Swift减少print函数的耗费
- 淘淘商城系列——单点登录之用户注册页面实现
- ipython notebook使用教程
- C语言中的 i++ 和 ++i 的区别
- 【Netty入门】几种序列化协议的介绍
- FAFU OJ 求a到b内的元素和
- git没有帮助文件No manual entry for git-**的解决办法
- CSS加载特效
- Mybatis传多个参数(三种解决方案)
- Oracle SQL性能优化和调优