使用ajax实现邮箱验证---前台输入完成，光标离开输入框后，将输入内容拿到后台验证是否存在，如果存在就提醒已经存在
Posted twuxian
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了使用ajax实现邮箱验证---前台输入完成，光标离开输入框后，将输入内容拿到后台验证是否存在，如果存在就提醒已经存在相关的知识，希望对你有一定的参考价值。
|--要求
|--实现方式：
1、前台使用使用函数检测输入内容，并使用jQuery的ajax异步将检测到的内容发送到后台对比
2、如果输入内容在数据库内已经存在，就提醒已经存在
|--代码
1 package cn.exercise.dao; 2 3 import cn.exercise.util.ConfigManager; 4 5 import java.sql.*; 6 7 public class BaseDao { 8 //引入ps对象，conn对象，rs对象 9 private PreparedStatement ps = null; 10 private Connection conn = null; 11 private ResultSet rs = null; 12 13 //引入连接数据库需要的配置信息 14 public final String driver = ConfigManager.getInstance().getString("jdbc.driver"); 15 public final String url = ConfigManager.getInstance().getString("jdbc.url"); 16 public final String user = ConfigManager.getInstance().getString("jdbc.userName"); 17 public final String pwd = ConfigManager.getInstance().getString("jdbc.password"); 18 19 /** 20 * 获取数据库连接 21 * 22 * @return 23 */ 24 public Connection getConn() { 25 try { 26 Class.forName(driver); 27 conn = DriverManager.getConnection(url, user, pwd); 28 } catch (ClassNotFoundException e) { 29 e.printStackTrace(); 30 } catch (SQLException e) { 31 e.printStackTrace(); 32 } 33 return conn; 34 } 35 36 /** 37 * 查询方法 38 * 39 * @param sql 40 * @param obj 41 * @return 42 */ 43 public ResultSet executeQuery(String sql, Object... obj) { 44 getConn(); 45 try { 46 ps = conn.prepareStatement(sql); 47 for (int i = 0; i < obj.length; i++) { 48 ps.setObject((i + 1), obj[i]); 49 } 50 rs = ps.executeQuery(); 51 } catch (SQLException e) { 52 e.printStackTrace(); 53 } 54 return rs; 55 } 56 57 58 /** 59 * 更新数据库的方法 60 * 61 * @param sql 62 * @param obj 63 * @return 64 */ 65 public int executeUpdate(String sql, Object... obj) { 66 getConn(); 67 int result = 0; 68 try { 69 ps = conn.prepareStatement(sql); 70 for (int i = 0; i < obj.length; i++) { 71 ps.setObject((i + 1), i); 72 } 73 result = ps.executeUpdate(); 74 } catch (SQLException e) { 75 e.printStackTrace(); 76 } 77 78 return result; 79 } 80 81 public void closeAll() { 82 try { 83 if (rs != null) { 84 rs.close(); 85 } 86 if (ps != null) { 87 ps.close(); 88 } 89 if (conn != null) { 90 conn.close(); 91 } 92 } catch (SQLException e) { 93 e.printStackTrace(); 94 } 95 } 96 97 98 99 }
1 package cn.exercise.dao; 2 3 import cn.exercise.pojo.JsonAnalysis; 4 import cn.exercise.pojo.User; 5 import com.sun.org.apache.xpath.internal.objects.XObject; 6 7 import java.sql.ResultSet; 8 import java.sql.SQLException; 9 10 public class UserDaoImpl extends BaseDao implements UserDao { 11 ResultSet rs = null; 12 JsonAnalysis jsonAnalysis = null; 13 14 @Override 15 public JsonAnalysis getUserByEmail(String uemail) { 16 //SELECT * from jsonanalysis WHERE uemail=? 17 String sql = "SELECT * from jsonanalysis WHERE uemail=?"; 18 Object obj = (Object) uemail; 19 rs = executeQuery(sql, uemail); 20 // System.out.println(rs); 21 22 try { 23 if (rs.next()) { 24 jsonAnalysis = new JsonAnalysis(); 25 // System.out.println(rs.getInt("uid")+rs.getString("uname")+rs.getString("uemail")); 26 jsonAnalysis.setUid(rs.getInt("uid")); 27 jsonAnalysis.setUname(rs.getString("uname")); 28 jsonAnalysis.setUemail(rs.getString("uemail")); 29 } 30 } catch (SQLException e) { 31 e.printStackTrace(); 32 } 33 // System.out.println(jsonAnalysis); 34 return jsonAnalysis; 35 } 36 37 38 // public static void main(String[] args) { 39 // UserDao user = new UserDaoImpl(); 40 // System.out.println(user.getUserByEmail("32567789@qq.com")); 41 // } 42 }
1 package cn.exercise.service; 2 3 import cn.exercise.dao.UserDao; 4 import cn.exercise.dao.UserDaoImpl; 5 import cn.exercise.pojo.JsonAnalysis; 6 7 public class JsonAnalysisServiceImpl implements JsonAnalysisService { 8 @Override 9 public boolean existByEmail(String uemail) { 10 boolean flag = false; 11 UserDao userDao = new UserDaoImpl(); 12 JsonAnalysis user = userDao.getUserByEmail(uemail); 13 if (user != null) { 14 flag = true; 15 } else { 16 flag = false; 17 } 18 return flag; 19 } 20 21 // public static void main(String[] args) { 22 // JsonAnalysisServiceImpl j=new JsonAnalysisServiceImpl(); 23 // System.out.println(j.existByEmail("32567789@qq.com")); 24 // } 25 }
1 package cn.exercise.web.serlet; 2 3 import cn.exercise.service.JsonAnalysisServiceImpl; 4 5 import javax.servlet.ServletException; 6 import javax.servlet.annotation.WebServlet; 7 import javax.servlet.http.HttpServlet; 8 import javax.servlet.http.HttpServletRequest; 9 import javax.servlet.http.HttpServletResponse; 10 import java.io.IOException; 11 import java.io.PrintWriter; 12 13 //@WebServlet(name = "AjaxServlet", urlPatterns = "/email") 14 @WebServlet("/email") 15 public class AjaxServlet extends HttpServlet { 16 protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 17 // this.doGet(request, response); 18 doGet(request, response); 19 } 20 21 protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { 22 System.out.println("测试是否有接到请求"); 23 response.setContentType("text/html;charset=UTF-8"); 24 String uemail = request.getParameter("uemail"); 25 String uname = request.getParameter("uname"); 26 String pwd = request.getParameter("pwd"); 27 JsonAnalysisServiceImpl jasi = new JsonAnalysisServiceImpl(); 28 29 String reback = ""; 30 if (jasi.existByEmail(uemail)) { 31 reback = "该邮箱已经注册,请换个邮箱注册"; 32 } else { 33 reback = "该邮箱未注册，可以使用"; 34 } 35 PrintWriter writer = response.getWriter(); 36 writer.println(reback); 37 } 38 }
前端
1 <%-- 2 Created by IntelliJ IDEA. 3 User: Administrator 4 Date: 2019/10/17 5 Time: 9:09 6 To change this template use File | Settings | File Templates. 7 --%> 8 <%@ page contentType="text/html;charset=UTF-8" language="java" %> 9 <html> 10 <head> 11 <title>邮箱验证</title> 12 <script src="js/jquery-1.12.4.js"></script> 13 <script> 14 function test() { 15 var a = document.getElementById("input").value; 16 // alert(a); 17 $.ajax({ 18 "url": "email", 19 "type": "get", 20 "data": "uemail="+a, 21 "dataType":"text", 22 "success":function (data) { 23 document.getElementById("a").innerText=data; 24 }, 25 "error":function () { 26 alert("请联系管理员"); 27 } 28 }) 29 } 30 </script> 31 </head> 32 <body> 33 <form action="/email" method="get"> 34 <table> 35 <tr> 36 <td>注册邮箱：</td> 37 <td><input type="email" name="uemail" onblur="test()" id="input"></td> 38 <td id="a">*</td> 39 </tr> 40 <tr> 41 <td>用 户 名：</td> 42 <td><input type="text" name="uname"></td> 43 <td>*</td> 44 </tr> 45 <tr> 46 <td>密 码：</td> 47 <td><input type="text" name="pwd"></td> 48 <td>*</td> 49 </tr> 50 <tr align="center"> 51 <td colspan="3"><input type="submit" value="提交"></td> 52 </tr> 53 </table> 54 </form> 55 56 </body> 57 </html>
|--过程中的错误
1、jsp访问servlet路径不对-----将jsp从一个目录里面取出来之后OK
2、resources文件夹没能被JDBC的ConfigManager读取到----右击resources文件夹，选择Make directory as --> resuorce root
3、servlet命名不规范，将"/email.do"写成“/Email.do”之后，服务器报错
4、将过滤器设置成了Servlet......导致服务器无法运行
以上是关于使用ajax实现邮箱验证---前台输入完成，光标离开输入框后，将输入内容拿到后台验证是否存在，如果存在就提醒已经存在的主要内容，如果未能解决你的问题，请参考以下文章
thinkPHP3.2.3利用Ajax前台实现验证码验证，但通过form表单的按钮提交后，验证码一直错误！如何解决?
314 Ajax案例：邮箱地址验证，搜索框输入自动提示，省市区三级联动