搞了慢慢兩天，終于弄明白了怎么在Struts2框架中使用Ajax檢測用戶名的存在了。雖然，比起那些大牛們來，這速度確實夠慢的，不過，最終弄出來還是滿滿的成就感啊。

閑話休提，言歸正傳。直接上代碼：

Action：

 1 package com.bbs.action; 2  3 import javax.servlet.http.HttpServletRequest; 4 import javax.servlet.http.HttpServletResponse; 5 import org.apache.struts2.ServletActionContext; 6  7 import com.bbs.model.*; 8 import com.opensymphony.xwork2.*; 9 10 @SupMySQLDAO();20         if (udao.ValiUserByName(username)) {21             res.getWriter().print("exists");22         } else {23             responseStr = "你可以使用該用戶名";24             res.getWriter().print(responseStr);25         }26         return null;27     } 28 }

這里第一行的package是我自己定義的Action包。網(wǎng)上有好多例子是JavaScript與jsp通信或者Servlet通信，但是鮮有與Action傳遞參數(shù)的例子。但我就是想讓JSP做純粹是展現(xiàn)的東西，并且如果再加上Servlet話，會破壞原有的MVC清晰架構(gòu)，所以在這一點上，我相信自己的堅持是對的。

至于怎么檢測用戶名是否在數(shù)據(jù)庫中存在，這就是一個很easy的問題了，此處就不講了，重點講一下我是怎么架構(gòu)的，其他無關(guān)緊要的細節(jié)，或者一搜就能搜到的解釋，本著簡明扼要的原則，一概忽略之。

Javascript：

 1 var req; 2 var span; 3 function Check(field) { 4     span = document.getElementById("result"); 5     if(field.value == '') { 6         span.style.color = "red"; 7         span.innerHTML="用戶名不能為空"; 8         return false; 9     }    10     if(window.xmlHttpRequest) {   //其他非IE瀏覽器支持11         req = new xmlhttpRequest();12     }else if(window.ActiveXObject) { //微軟的IE支持13         req = new ActiveXObject("Microsoft.XMLHTTP");14     }15     16     req.onreadystatechange = press;17     req.open("POST", "http://localhost:8080/BBS/CheckUser?username="+field.value, true);18     req.setRequestHeader("Content-type","application/x-www-form-urlencoded");19     req.send("");20 }21 22 function press() {23     if(req.readyState < 4) {24         span.style.color = "blue";25         span.innerHTML="正在檢測";26     }27     if(req.readyState == 4) {28         if(req.status == 200) {29             if(req.responseText == "exists") {30                 span.style.color = "red";31                 span.innerHTML="用戶名已經(jīng)存在";32             }else {33                 span.style.color = "green";34                 span.innerHTML="您可以使用該用戶名";35             }            36         }37     }38 }

這一段代碼是用來實現(xiàn)Ajax用戶名檢測的部分。第5-9行是檢測用戶名為空的代碼，很好理解。重點是后面的部分。首先，建立一個XMLHttpRequest對象，這是實現(xiàn)Ajax的核心部分，只有用它才能用來

向后臺發(fā)送請求，發(fā)送請求分兩步：打開連接，發(fā)送請求。

打開連接用open方法。

open方法的原型 open("method","URL",[,asyncFlag[,"userName"[,"passWord"]]]);

method：POST/GET。這兩種方法的區(qū)別就不詳細介紹了，到處都有介紹。需要注意一點是：必須要有雙引號，我就因為沒加引號，找了半天才找到原因，汗。

asyncFlag：true代表異步，一般情況下我們應(yīng)該選擇這個；false代表同步。

后面的username和password則專用于一些遠程服務(wù)。

發(fā)送請求用send方法。

send(content)；//content 是請求參數(shù)。一般情況下可以省略。

setRequestHeader():在發(fā)送之前要設(shè)置請求頭。

onreadystatechange參數(shù)用來設(shè)置相應(yīng)的回調(diào)函數(shù)。

后面的press就是那個回調(diào)函數(shù)。

關(guān)于status的各種解釋此處從略。

這里的span就是用來在用戶名輸入框后面做語句展現(xiàn)的。

HTML代碼：

1 <input  id="regusername" type="text" name="username" size="50" maxlength="12" value=""  autocomplete="off" onblur="Check(this)"/>    2 <span id = "result"></span>    

Action部分：

1 <package name="server" namespace="/"  extends="struts-default">2         <action name="CheckUser" class="com.bbs.action.CheckUser">3             <result name="success">Welcome.jsp</result>4             <result name="input">Register.jsp</result>5          </action>6 </package>

其實此處的result部分，無所謂了，因為注意一下前面的Action最后返回的是null，為什么是null呢？因為前面的JavaScript部分，有一句是利用responseText與字符串比較來產(chǎn)生不同的效果。

如果是success或者input的話，會直接將跳轉(zhuǎn)后的頁面（Welcome.jsp/Register.jsp）返回過來。此處又折騰了半天，汗。

另外雖然好多資料都講到responseText是一個字符串，但是實際上，不能完全按照字符串的處理方法去處理他，剛開始我用equals函數(shù)，沒有反應(yīng)，后來改成==才能達到效果。

總之，費了九牛二虎之力終于還是搞定了，還是覺得自己很菜很菜，但是只要相信自己一定能做到，那么你就肯定能做到。遇到困難不要急躁，總會有辦法的。雖然有點雞湯，但望諸君切記。

下一步，打算實現(xiàn)Ajax分頁。