场景描述:
登录程序大家都不陌生,但如果要注册,则必须保证用户的ID不能重复,这种检测用户ID的操作可以通过Ajax完成。
表结构:
<html> <head><title>异步验证</title></head> <body> <script language="JavaScript"> var xmlHttp; var flag; function createXMLHttp(){ if (window.XMLHttpRequest){ // 创建XMLHttpRequest核心对象 xmlHttp = new XMLHttpRequest() // 使用FireFox内核 }else { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); // 使用IE内核的浏览器 } } function checkUserid(userid){ // 显示信息 createXMLHttp(); // // 设置请求,通过地址重写方式将userid传递到JSP中 xmlHttp.open("POST","CheckServlet?userid="+userid); // 设置完请求后调用处理回调函数 xmlHttp.onreadystatechange = checkUseridCallback; xmlHttp.send(null); // 发送请求,不设置参数 //document.getElementById("msg").innerHTML = "正在验证……"; //alert("*******"); } function checkUseridCallback(){ // 回调函数 if (xmlHttp.readyState == 4){ // 数据返回完毕 if (xmlHttp.status == 200){ // HTTP操作正常 alert("*****8"); var text = xmlHttp.responseText;// 接收返回内容 if (text == "true"){ flag = false; // 无法提交表单 document.getElementById("msg").innerHTML = "用户名ID重复,无法使用"; }else { flag = true; // 可以提交表单 document.getElementById("msg").innerHTML = "恭喜!此用户ID可以注册"; } } } } function checkForm(){ // 对表单判断能否进行提交操作 return flag; } </script> <form action="xxx.jsp" method="post" onsubmit="return checkForm()"> 用户ID:<input type="text" name="userid" onblur="checkUserid(this.value)"><span id="msg"></span><br> 姓 名:<input type="text" name="name"><br> 密 码:<input type="password" name="password"><br> <input type="submit" value="注册"> <input type="reset" value="重置"> </form> </body> <html>
Sevlet.java
package zz.ajax; import java.io.*; import java.sql.Connection; import java.sql.DriverManager; import java.sql.ResultSet; import java.sql.PreparedStatement; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; public class CheckServlet extends HttpServlet{ public static final String DBDRIVER = "org.gjt.mm.mysql.Driver"; public static final String DBURL = "jdbc:mysql://localhost:3306/zz"; public static final String DBUSER = "root"; public static final String DBPASSWORD = "mysql"; public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException,java.io.IOException{ this.doPost(request, response); } public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException,java.io.IOException{ request.setCharacterEncoding("GBK"); response.setContentType("text/html"); // 设置回应的MIME Connection conn = null; PreparedStatement pstmt = null; ResultSet rs = null; PrintWriter out = response.getWriter(); // 接收验证的userid String userid = request.getParameter("userid"); try{ Class.forName(DBDRIVER); // 加载驱动 conn = DriverManager. getConnection(DBURL, DBUSER, DBPASSWORD); // 连接数据库 String sql = "SELECT COUNT(userid) FROM user WHERE userid=?"; pstmt = conn.prepareStatement(sql); pstmt.setString(1, userid); rs = pstmt.executeQuery(); System.out.printf("*********"); if (rs.next()){ if (rs.getInt(1) > 0){ // 判断ID是否已存在 out.print("true"); // 已存在 }else { out.print("false"); } } out.close(); }catch (Exception e){ e.printStackTrace(); }finally { try{ conn.close(); }catch (Exception e){ e.printStackTrace(); } } } }
Servlet映射配置
<servlet> <servlet-name>check</servlet-name> <servlet-class> zz.ajax.CheckServlet </servlet-class> </servlet> <servlet-mapping> <servlet-name>check</servlet-name> <url-pattern>/14_Ajax/CheckServlet</url-pattern> </servlet-mapping>
网页错误详细信息 消息: 'userid' 未定义 行: 18 字符: 3 代码: 0 URI: http://localhost/demo/14_Ajax/regist.htm ?function checkUserid(userid){ // 显示信息 没有声明参数
不能进入
if (xmlHttp.status == 200){ // HTTP操作正常
alert("*****3");
说明HTTP操作不正常,那怎么返回HTTP状态码?
调试过程:
if (xmlHttp.readyState == 4){ // 数据返回完毕 //alert("*****2"); alert(xmlHttp); alert(xmlHttp.readyState); alert(xmlHttp.status); if (xmlHttp.status == 200){ // HTTP操作正常 alert("*****3");
xmlHttp.readyState == 4 说明数据返回完毕
数据返回完毕,但服务器找不到指定的资源(),文档不存在!而且Servlet调试根本未进入,这是为什么???
MLDN论坛李祺老师解答:
说明你的AJAX提交路径对应的资源不存在。
你的Servlet必须将编译后的class文件放到项目的WEB-INF/classes目录下,并放到对应的包中,如果没有加入,则会找不到资源
我又出这样的问题:
Servlet.java文件不必放在WEB-INF/classes文件夹下
!!!!!!!但你的<servlet-class>
zz.ajax.CheckServlet
</servlet-class>是放哪?
其它编译错误:
java.lang.ClassNotFoundException: DBDRIVER
Class.forName("DBDRIVER"); // 加载驱动 不要“”
显示效果: