Ajax——异步检查用户名是否存在示例

在任何网站注册用户的时候，都会检查用户是否已经存在。很久以前的处理方式是将所有数据提交到服务器端进行验证，很显然这种方式的用户体验很不好；后来有了Ajax，有了异步交互，当用户输完用户名继续填写其他信息的时候，Ajax就将信息发到了服务器去检查该用户名是否已经被注册了，这样如果用户名已经存在，不用等用户将所有数据都提交就可以给出提示。采用这种方式大大改善了用户体验。

regist.jsp

pageEncoding="UTF-8"%>

Insert title here

var xmlHttp;

//创建Ajax核心对象XMLHttpRequest

function createXMLHttp(){

if(window.XMLHttpRequest){

xmlHttp = new XMLHttpRequest();

}else{

xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

}

}

function checkUsername(username){

createXMLHttp();

//设置请求方式为GET，设置请求的URL，设置为异步提交

xmlHttp.open("GET","CheckServlet?username="+username,true);

//将方法地址复制给onreadystatechange属性

//类似于电话号码

xmlHttp.onreadystatechange = checkUsernameCallback();

//将设置信息发送到Ajax引擎

xmlHttp.send(null);

}

function checkUsernameCallback(){

//Ajax引擎状态为成功

if(xmlHttp.readyState == 4){

//HTTP协议状态为成功

if(xmlHttp.status == 200){

var text = xmlHttp.responseText;

if(text == "true"){

document.getElementById("msg").innerHTML = "此用户名已存在，无法使用！";

}else{

document.getElementById("msg").innerHTML = "此用户名可以使用";

}

}

}

}

用户名:

密  码:

CheckServlet.java

public class CheckServlet extends HttpServlet {

private static final long serialVersionUID = 1L;

public static final String DBDRIVER = "com.microsoft.sqlserver.jdbc.SQLServerDriver";

public static final String DBURL = "jdbc:sqlserver://localhost:1433;DatabaseName=bbs";

public static final String DBUSER = "sa";

public static final String DBPASS = "pass";

public CheckServlet() {

super();

}

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

this.doPost(request, response);

}

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

request.setCharacterEncoding("UTF-8");

response.setContentType("text/html");

Connection conn = null;

PreparedStatement pst = null;

ResultSet rs = null;

PrintWriter out = response.getWriter();

String username = request.getParameter("usernaem");

try{

Class.forName(DBDRIVER);

conn = DriverManager.getConnection(DBURL,DBUSER,DBPASS);

String sql = "select count(username) from user where username=?";

pst = conn.prepareStatement(sql);

pst.setString(1,username);

rs = pst.executeQuery();

if(rs.next()){

if(rs.getInt(1)>0){//用户名已经存在了

out.print("true");

}else{

out.print("false");

}

}

}catch(Exception e){

e.printStackTrace();

}finally{

try{

conn.close();

}catch(Exception e){

e.printStackTrace();

}

}

}

}相关阅读:

HTML常用标签大全及html标签的特点

Android中通过AsyncTask类来制作炫酷进度条的实例教程

探寻Android的线程问题

Android的APK应用签名机制以及读取签名的方法

IE下模拟css3中的box-shadow(阴影)效果代码

Java锁之阻塞锁介绍和代码实例

Android4.2中全屏或者取消标题栏的方法总结

Java操作FreeMarker模板引擎的基本用法示例小结

WinXP开启任何程序任务栏出现2个相同标签的解决方法

利用SVG和CSS3来实现一个炫酷的边框动画

php使用unset()删除数组中某个单元(键)的方法

Fedora 7.0 中文输入法

实用的简单PHP分页集合包括使用方法

android读取assets文件示例