快捷導(dǎo)航

ajax對注冊名進行驗證檢測是否存在于數(shù)據(jù)庫中

更新時間：2013年07月28日 16:00:42 作者：

使用ajax對注冊名進行驗證判斷它是否在數(shù)據(jù)庫中存在，具體的實現(xiàn)如下，感性的朋友可以參考下，希望對大家有所幫助

這個是我在網(wǎng)上看到的一個有錯的ajax 我改正確了，卻找不到那個帖子了。
用servlet驗證：

 
package Servlet; 
import java.io.*; 
import java.sql.*; 
import java.io.IOException; 
import java.io.PrintWriter; 
import javax.servlet.*; 
import javax.servlet.http.HttpServletRequest; 
import javax.servlet.http.HttpServletResponse; 
import javax.servlet.http.HttpServlet; 
public class CheckServlet extends HttpServlet { 
static HttpServletRequest request = null; 
static HttpServletResponse response = null; 
public static void main(String[] args) throws Exception, IOException{ 
CheckServlet c = new CheckServlet(); 
c.doPost(request, response); 
} 

public static final String DBDRIVER = "com.mysql.jdbc.Driver"; 
public static final String DBURL = "jdbc:mysql://localhost:3306/spring"; 
public static final String DBUSER = "root"; 
public static final String DBPASS = "liangke"; 
public void doGet(HttpServletRequest request, HttpServletResponse response) 
throws ServletException, IOException { 
this.doPost(request, response); 
} 
public void doPost(HttpServletRequest request, HttpServletResponse response) 
throws ServletException, IOException { 
request.setCharacterEncoding("gbk"); 
response.setContentType("text/html"); 
Connection conn = null; 
PreparedStatement pstmt = null; 
ResultSet rs = null; 
PrintWriter out = response.getWriter(); 
String userid = request.getParameter("userid");// 接受驗證的用戶名 
try { 
Class.forName(DBDRIVER); 
conn = DriverManager.getConnection(DBURL, DBUSER, DBPASS); 
String sql = " select * from user where username=?"; 
pstmt = conn.prepareStatement(sql); 
pstmt.setString(1, userid); 
rs = pstmt.executeQuery(); 
StringBuffer jsonStr=new StringBuffer(); 
jsonStr.append("[{flag:'"); 
if(rs.next()){ 
jsonStr.append("true',alertTest:'aaa'}]"); 
out.println(jsonStr.toString()); 
}else{ 
jsonStr.append("false',alertTest:'bbb'}]"); 
out.println(jsonStr.toString()); 

} 

out.close(); 
} catch (Exception e) { 
e.printStackTrace(); 
} finally { 
try { 
conn.close(); 
} catch (SQLException e) { 
e.printStackTrace(); 
} 
} 
} 
} 

前臺顯示頁面：

復(fù)制代碼代碼如下:

 
<%@ page language="java" pageEncoding="utf-8"%> 
<%@ page import="java.sql.*"%> 
<%@ page import="java.util.*"%> 
<!doctype html> 
<html lang="en"> 
<body> 
<script> 
//onload 當(dāng)頁面加載的時候會調(diào)用這個方法initPage 
window.onload = initPage; 
function initPage() { 
alert("ee"); 
document.getElementById("userid").onblur = checkUserid;//引用函數(shù)方法。 onblur 事件在用戶離開輸入框時執(zhí)行 JavaScript 代碼 
} 
//創(chuàng)建請求對象 
function createRequest() { 
try { 
request = new XMLHttpRequest(); 
} catch (tryMS) { 
try { 
request = new ActiveXObject("Msxml2.XMLHTTP"); 
} catch (otherMS) { 
try { 
request = new ActiveXObject("Microsoft.XMLHTTP"); 
} catch (failed) { 
request = null; 
} 
} 
} 
return request; 
} 
//檢查用戶名是否重復(fù) 
function checkUserid(){ 
alert("dd"); 
request=createRequest(); 
var theName = document.getElementById("userid").value; 
request.open("POST","CheckServlet?userid="+theName,true); 
request.onreadystatechange=checkUseridCallback; 
request.send(null); 
document.getElementById("msg").innerHTML="正在驗證..."; 
} 
//回調(diào)函數(shù) 
function checkUseridCallback(){ 
if(request.readyState==4){ 
if(request.status==200){ 

var v = request.responseText; 
var value1= eval(v)[0]; 
if( value1.flag=="true"){ 
document.getElementById("msg").innerHTML="用戶ID重復(fù)"; 
}else{ 
document.getElementById("msg").innerHTML="此用戶ID可以注冊"; 

} 
} 
} 
} 
</script> 
<form action="check.jsp" method="POST"> 
用戶ID： 
<input type="text" id="userid" name="userid"> 
<span id="msg"></span> 
<br> 
姓名 
<input type="text" name="name"> 
</form> 
</body> 
</html> 