使用AJAX实现用户名的唯一性校验（注册界面）-JAVA（新手）
- (1)实现用户名的唯一性校验
所需要准备的：
- Servlet
- 注册界面的JSP
- 接口和实现类
所需要的接口和实现类：
接口：
/* * 用户注册 * 账号的唯一性校验，需要传参（username） * */ boolean Username(String username);
实现类： @Override public boolean Username(String username) { String sql = "select * from user where username = ?"; List<Map<String, Object>> list = DBUtil.excuteQuery(sql, username); return list.size()>0; }
所需要的注册的JSP界面：
<body> <div class="wrap"> <div class="guimeilogo"></div> <div class="register"> <div class="top"> <h1>新用户注册</h1> <a href="/shop/views/login.jsp">已有账号</a> </div> <div class="mid"> <form action="/shop/register" method="post"> <input type="text" name="username" id="username" placeholder="亲，您的昵称" required="required" /> <div id="showMessage"></div> <input type="password" name="password" id="password" placeholder="密码" required="required" /> <input type="text" name="email" id="email" placeholder="邮箱" required="required" /> <input type="text" name="telephone" id="telephone" placeholder="手机号" required="required"/> <div class="sec"> <input type="text" name="code" id="code" placeholder="验证码" required="required" /> <a class="send" onclick="send()"> 发送验证码 </a> <script> function send(){ return false; } </script> </div> <input type="submit" id="submit" value="注册"/> </form> </div> </div> </div> <script src="js/jquery-2.1.0.js"></script> <script> username.onblur = function () {
<--/工程名/Servlet映射路径--> $.post("/shop/chexkusername" ,{username:this.value }, function (date) { if ( date.code == "10010" ){ $("#showMessage").html("对不起，此用户名已经被使用").css("color","red"); } else{ $("#showMessage").html("该用户名可以使用").css("color","blue") } }); } </script> </body> </html>
个人理解：
获取Username-使用Post提交-使用if、else判断-如果说状态码等于10010则意味着用户名相重，则提示用户名已经被使用。
反之，如果不等于10010则意味着用户名可以使用。
所需要的Servlet：
@WebServlet("/chexkusername") public class ChexkUsernameServlet extends HttpServlet {
/*
* 注册时用户名的唯一性校验。
*
* 因为是判断用户名是否重复，则需要传递参数（user表里的username）
* 如果说重复则需要提示用户让用户进行更改。反之则提示用户可以使用。
*
* 所以首先，我们在Servlet中需要干的第一件事就是获取请求参数username
* 第二步就是调用DAO层检验用户名是否唯一。
* 第三步需要设置编码格式，因为是使用post请求，在浏览器中会出现乱码的现象，所以我们要设置一下编码格式。
* 第四步我们需要将检验结果返回给浏览器。
* 然后进行是否被使用的判断，还有可用和不可用的代码块和语句的提示。
*
* 在最后一步将Map转为JSON，因为使用JSON可以更方便的获取到值，而不用再使用共享参数、请求转发等操作。
* */
@Override protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { // 1、接收请求参数。 String username = req.getParameter("username"); // 2、调用DAO 检验用户名是否唯一。 IUserDAO dao = new UserDAOImpl(); boolean username1 = dao.Username(username); // 3、设置编码格式。 resp.setContentType("text/json;charset=UTF-8"); // 4、将检验结果返回给浏览器（响应Ajax请求） PrintWriter writer = resp.getWriter(); Map<Object, Object> Map = new HashMap<>(); //如果输入的用户名和数据库表内的一致则提示用户名已经被使用 if (username1){ //code、message为状态码 Map.put("code","10010"); Map.put("message","用户名已经被使用"); //否则则是不一致则提示登录成功。 } else{ Map.put("code","10086"); Map.put("message","恭喜，用户名可用"); } //转为JSOn String s = JSON.toJSONString(Map); writer.write(s); writer.close(); } }
个人理解：
用户点击注册界面，在用户名一栏输入用户名，当鼠标的光标离开输入框时，就去检验用户的用户名是否有重复。
这样可以节省资源，避免用户资源的浪费，因为以前所使用的方法，是在用户点击注册之后才去进行用户名的唯
一性校验，如果错误，则需要返回一个新的界面并且提示用户名重复，即占用了又浪费了用户流量。
所以选择AJAX——>AJAX，允许被浏览器和服务器通信而无需刷新当前页面的技术都被叫做AJAX。
