目的是想检测输入的用户名是否是重复的。现在是非空验证是有反应的,但是验证用户名重复没用。
Login.java:
Java code?package com.pb.servlet; import java.io.IOException; import java.io.PrintWriter; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; public class Login extends HttpServlet { public Login() { super(); } public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doPost(request, response); } public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setContentType("text/html;charset=UTF-8"); PrintWriter out= response.getWriter(); String username=request.getParameter("username"); System.out.println(username); boolean exit=false; if("accp".equals(username)){ exit=true; out.print(exit); }else { out.print(exit); } out.flush(); out.close(); } }
index.jsp:
XML/HTML code?<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <html> <head> <title>使用jQuery验证用户名</title> <!-- 本网页的目的: 1、实现验证用户名和密码的跳转 2、用户名和密码不能为空 相关页面:验证页面:Login.java(servlet),success.jsp成功跳转页面。 --><script type="text/javascript"> function checkname(ouser) { var username=ouser.value; if(!username){ alert("用户名不能为空!"); ouser.focus(); return; } //ajax验证用户名是否重复,GET方式。 //请求的字符地址 var url ="servlet/Login?username="+username; //判断不同的浏览器XMLHttpRequest创建方法。 xhr=creatXmlHttpRequest(); //设置回到函数 xhr.onreadystatechange = backcall; //初始化XMLHttpRequest组件 xhr.open("GET",url,true); //发送请求 xhr.send(null); } //判断浏览器版本,创建XMLHttpRequest对象 function creatXmlHttpRequest() { if(window.XMLHttpRequest) { return new XMLHttpRequest(); }else { return new ActiveXObject("Microsoft.XMLHTTP"); } } //回到函数 function backcall() { if(xhr.readyState == 4 && xhr.states ==200 ) { if(xhr.responseText){ alert("用户名已存在!"); }else { alert("用户名可以使用!"); } } } </script> </head> <body> <form action="" method="get"> <input id="userName" type="text" onblur="checkname(this);"></input> <span class="msg1"></span> <input id="password" type="password" ></input> <span class="msg2"></span> <input type="submit" value="登录"></input> </form> </body> </html>
web.xml:
XML/HTML code?<?xml version="1.0" encoding="UTF-8"?> <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"> <display-name></display-name> <servlet> <description>This is the description of my J2EE component</description> <display-name>This is the display name of my J2EE component</display-name> <servlet-name>Login</servlet-name> <servlet-class>com.pb.servlet.Login</servlet-class> </servlet> <servlet-mapping> <servlet-name>Login</servlet-name> <url-pattern>/servlet/Login</url-pattern> </servlet-mapping> <welcome-file-list> <welcome-file>index.jsp</welcome-file> </welcome-file-list> </web-app>
xhr.states ==200
改成
xhr.status ==200
为了防止缓存
var url ="servlet/Login?username="+username;
改成
var url ="servlet/Login?username="+ encodeURIComponent(username) + "&t=" + (new Date()).getTime();