Ajax驗證用戶名是否存在的實例代碼
jsp頁面
<head> <script type="text/javascript" src="js/register.js"></script> </head> <table> <td>用戶名：</td> <td> <input type="text" name="r_name" id="r_name" onblur="checkusername()"> <span id="span01"> </td> </table>
js文件夾下的register.js
//創建對象
function ajaxfunction(){
var xmlhttp;
try{
// 適用于ie7+, firefox, chrome, opera, safari
xmlhttp=new xmlhttprequest();
}
catch(e){
try{
//internet explorer
xmlhttp=new activexobject("msxml2.xmlhttp");
}
catch(e){
try{
// 適用于ie6, ie5
xmlhttp=new activexobject("microsoft.xmlhttp");
}
catch(e){
xmlhttp=false;
}
}
}
return xmlhttp;
}
var flag=ture;
function checkusername(){
//獲取jsp頁面輸入的值
var name=document.getelementbyid("r_name").value;
if(name==""||name==null){
document.getelementbyid("span01").innerhtml="<font color='red'>用戶名不能為空！</font>"
flag=false;
}else{
//1.創建對象
var request=ajaxfunction();
//2.發送請求
request.open("post","/studyweb/checkusernameservlet",true);//true表示異步提交
//注冊狀態改變監聽，獲取服務器傳送過來的數據
request.onreadystatechange=function(){
//readystate==4表示請求已經完成，且響應已就緒。status==200表示“ok”
if(request.readystate==4 && request.status==200){
var data=request.responsetext;//獲取checkusernameservlet中response中存儲的值
if(data == 1){
document.getelementbyid("span01").innerhtml="<font color='red'>用戶名已存在！</font>"
flag=false;
}else{
document.getelementbyid("span01").innerhtml="<font color='green'>√</font>"
flag=true;
}
}
}
//如果是post方式帶數據，那么這里要添加頭，說明提交的數據類型是一個經過url編碼的form表單數據
request.setrequestheader("content-type","application/x-www-form-urlencoded;charset=utf-8");
//帶數據過去，在send方法里填寫表單數據
request.send("name="+name);
}
return flag;
}
后臺studyweb項目下的checkusernameservlet
protected void dopost(httpservletrequest request, httpservletresponse response) throws servletexception, ioexception {
//獲取ajax發送過來的name值
string r_name=request.getparameter("name");
try {
//檢驗是否存在該用戶名
boolean isexist=userservice.checkusername(r_name);
system.out.println("isexist"+isexist);
//通知頁面，到底有沒有
if(isexist){
response.getwriter().println(1);//存在用戶名
}else{
response.getwriter().println(2);//不存在該用戶
}
} catch (exception e) {
e.printstacktrace();
}
}
userdaoimpl中方法的實現
public boolean checkusername(string u_name) {
boolean flag=false;
string sql="select u_id,u_name,u_password,u_email,u_phone from user where u_name=?";
conn=super.getconnection();
try {
pstmt=conn.preparestatement(sql);
pstmt.setstring(1,u_name);
rs=pstmt.executequery();
//如果存在我輸入的用戶名和數據庫表中已有的用戶名相同時
if(rs.next()){
flag=true;
}
} catch (sqlexception e) {
e.printstacktrace();
}finally{
super.closeall(conn, pstmt, stmt, rs);
}
return flag;
}
總結
以上所述是小編給大家介紹的ajax驗證用戶名是否存在的實例代碼，希望對大家有所幫助，如果大家有任何疑問歡迎給我留言小編會及時回復大家的！
學習AJAX