功能分析
register.html
1、使用js完成表单校验
2、使用ajax完成表单提交
3、注册完成,跳转成功页面
registUserServlet
1、获取数据
2、封装user对象
3、调用service完成注册
4、根据service的返回,提示信息
(1)将提示信息转换为jscn
(2)设置响头contentType
UserService
registUser(User user)
1、调用dao根据用户名查询用户
* 存在:直接返回false
* 不存在:调用dao保护用户信息
UserDao
findByUsername(String username)
save(User user)
表单校验1
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>登录</title> <script src="../static/js/jquery-3.6.1.min.js" type="text/javascript" charset="utf-8"></script> <script src="../static/js/login.js" type="text/javascript" charset="utf-8"></script> <style> a{ display: block; text-decoration: none; width: 50px; height: 22px; background-color: #5cb85c; text-align: center; line-height: 22px; color: white; border-radius: 2px; font-size: 12px; border-width: 1px; border-style: solid; border-color: #5cb85c; } a:hover{ display: block; text-decoration: none; width: 50px; height: 22px; background-color: #7ad67a; text-align: center; line-height: 22px; color: white; border-radius: 2px; font-size: 12px; } </style> <script> function checkUsername() { alert("校验用户名"); return false; } $(function () { // 当表单提交时,调用所有的校验方法 $("#registerForm").submit(function () { return checkUsername(); // 如果这个方法没有返回值,或者返回true,则表单提交,如果返回false,则表单不提交 }); }) </script> </head> <body> 用户名:<input id="username" type="text" name="fname"><br> 密码<input id="password" type="password" name="lname"><br> <a href="#" class="button button-big button-fill" id="submit">提交</a> <a href="/show/register" style="margin-top:10px;" class="button button-big button-fill">注册</a> </body> </html>
标签:功能分析,color,text,校验,表单,22px,border From: https://www.cnblogs.com/shenziyi/p/17100422.html