小伙伴在上網的時候，需要下載或者觀看某些視頻資料，更或者是在逛淘寶的時候，我們都需要注冊一個用戶，當我們填寫好各種信息，點擊確定的時候，提示用戶名已經存在，小編就想，為什么當我們填寫完用戶名的時候，她就自動提示用戶名已經存在，我們也不需要浪費那么多感情，直到填寫完那么多的信息之后在提示，在小編最近的項目中，就碰到這個問題，我們可以使用ajax完成用戶名是否存在，今天這篇博客，小編就簡單的總結一下，如何使用ajax來完成校驗，還請小伙伴多多指教哦`(*∩_∩*)′！

       首先ajax完成用戶名是否存在異步校驗，那么我們該如何做呢？在這里，我們要由事件進行觸發，也就是說，我們在用戶名里面輸入的時候，鼠標移開，這個事件叫做onblur，即失去焦點，與其相對的，鼠標放在里面獲得焦點，我們稱之為onfocus，那么失去焦點，我們該怎么操作呢？首先找到注冊頁面，在注冊頁面找到用戶名那部分的代碼，在后面加上onblur=checkUsername（），校驗用戶名即可，接著我們來編寫方法checkUsername，具體代碼如下所示：

<span style="font-size:18px;">function checkUsername() {     //獲取文本框值:     var username = document.getElementById("username").value;     //1、創建異步交互對象     var xhr = createXmlHttp();     //2、設置監聽     xhr.onreadystatechange = function() {       if (xhr.readyState == 4) {         if (xhr.status == 200) {           document.getElementById("span1").innerHTML = xhr.responseText;         }       }     }     //3、打開連接     xhr.open("GET",         "${pageContext.request.contextPath}/user_findByName.action?time="             + new Date().getTime() + "&username=", true)     //4、發送     xhr.send(null);   }   function createXmlHttp() {     var xmlHttp;     try {       xmlHttp = new XMLHttpRequest();     }     catch (e) {       try {         xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");       }        catch (e) {         try {           xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");         } catch (e) {}       }     }     return xmlHttp;   } </span> 

      接著，我們來建立實體Vo，實現模型驅動，自動實現封裝，具體代碼如下所示：

<span style="font-size:18px;">package cn.itcast.shop.user.vo; public class User {   private Integer uid;   private String username;   private String password;   private String name;   private String email;   private String phone;   private String addr;   private Integer state;   private String code;   public Integer getUid() {     return uid;   }   public void setUid(Integer uid) {     this.uid = uid;   }   public String getUsername() {     return username;   }   public void setUsername(String username) {     this.username = username;   }   public String getPassword() {     return password;   }   public void setPassword(String password) {     this.password = password;   }   public String getName() {     return name;   }   public void setName(String name) {     this.name = name;   }   public String getEmail() {     return email;   }   public void setEmail(String email) {     this.email = email;   }   public String getPhone() {     return phone;   }   public void setPhone(String phone) {     this.phone = phone;   }   public String getAddr() {     return addr;   }   public void setAddr(String addr) {     this.addr = addr;   }   public Integer getState() {     return state;   }   public void setState(Integer state) {     this.state = state;   }   public String getCode() {     return code;   }   public void setCode(String code) {     this.code = code;   } }</span>