Ajax的JSP示例以及相關知識介紹，適合於入門者
這是學習AJAX的第一篇文章，我把自己學習一些心得寫出來，因為是從初學者的腳度出發，可能會寫得比較詳細，因為我就是一個初學者，也知道作為一個初學者，隨隨便便的拿一個例子就看看，是隻知道要這樣，但為什麼要這樣卻不清楚，我這裡就盡我自己的語言，讓初學者和我一樣，能夠看了這篇文章之後，“哦，這裡原來是這樣的”。我個人還是喜歡從例項出發，對我自己而言，看了過後如果沒有例項鞏固，效果就不會那麼好，也就不會減除對這個東西的神祕感，其實，從我個人的腳度出發後，因為前面寫了兩篇關於使用innerHTML實現動態效果的文章，再學這個就做了一個很好的鋪墊了。因為這裡面許多的時候都會使用innerHTML，不過，這個要注意，這個東東只支援微軟的瀏覽器（我的FireFox不行，其它牌子支援與否我沒有測試過，不過，在瀏覽器界中，好像只有微軟的獨樹一家，亂來，呵呵），你可以看一下我先面的兩篇文章：
利用innerHTML實現隱顯效果-兩種實現方法
通過改變innerHTML的內容，動態增加選擇項
學習使用AJAX之前，有幾樣的東西是必須的：
1、HTML
2、DHTML，就是動態HTML，這裡可能會常用到document.getElementById([id])方法，或者是使用window.id.value=[value]等等，如果不熟悉，不及，看看下面的例子，如果還不能夠理解，再把網上搜搜，這方面的解釋多得不能夠再多了。
3、Javascript。這個就是非常的重要的，因為好多東西都需要通過這個去操作。
4、DOM。這個不是必須的，就算我們不知道這個東西，照樣可以用JAVASCRIT做很多的東西了。
5、資料庫操作及SQL知識。現在應用程式好多都是與資料庫打交道，常見的使用者名稱資訊等等，都是放在資料庫中的。
下面進行正題吧，這個例項非常的簡單，採用JSP實現使用者輸入的使用者是否存在於資料庫中，並且給以相應的提示，所謂“麻雀雖小，五臟俱全”，其它的發揮就是在這個方向上發揮開發。
總共有三個檔案，有兩個JSP面，一個用於前臺顯示，一個用於確定使用者是否存在;另外一個JAVA頁面，用於做資料庫連線。
注：請注意其中註釋，那是非常的有助於你理解
第一個前臺顯示：index.jsp
<html>
<head>
<title></title>
<script language="javascript" >
var httpRequest;
//下面這個函式可以返回一個適合任何瀏覽器的httpRequest，步子如下：
//1.試著建立一個XMLHttpRequest()示例，該示例可適合於除了微軟以外的所有瀏覽器
//2.增加錯誤判斷，如果當前瀏覽器是微軟的，那麼就建立適用於微軟的瀏覽器
//3.但微軟的瀏覽器又有兩個版本之分，不過據說微軟已經在7.0中增加對XMLHttpRequest()的支援
//4.但這樣也需要對原來的瀏覽器支援，否則你寫出來的程式那些用老版本瀏覽器的使用者就是看不到效果的。
function createRequest()
{
try{
request=new XMLHttpRequest();
}catch(trymicrosoft)
{
try{
request=new ActiveXObject("Msxml2.XMLHTTP");
}catch(othermicrosoft)
{
try{
request=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(failed)
{
request=false;
}
}
}
if(!request)
{
alert("err Happend!");
return null;
}
return request;
}
//這個函式就是使用者的動作所有觸發的函式，如下面的onblur()時，就會呼叫該函式
//經過的步驟如下：
//1.從HTML頁面得到你需要的資料，可以採有document.getElementById("")方法。
//2.建立需要的URL，該URL就和在FORM裡面的method為get時並採用submit提交在位址列裡面到的一樣
//3.開啟與伺服器的連線，這裡面有三個必要的引數，雖然文件規定只有兩個，但是我個人覺得最好用三個，
// 第一個可以是GET,POST或者是POST，但常用的就是前面的兩個，並且最好都用大寫，因為有些瀏覽器如FireFox可能會報錯，
// 第二個就是打報的URL，這肯定你是必須的。
// 第三個就是下面的看到的true，這裡可以是false。true表示同步處理，你提交後可以做其它的事情，
// 這就是AJAX裡面的A，即asynchronous;如是false，那就得等到伺服器的返回才能夠做其它的事情。
//4.等到伺服器完成，並且確定返回執行了正確執行的提示，我們就可以做下面我們想做的事情。這些後面的事情就必須通過
// Javascript去完成了，因為XMLHttpRequest的唯一用途就是傳送請求及接收伺服器的響應結果。
//5.上面都完成了後，就可以採用send()方法向伺服器傳送你需要傳送的資訊了，它的引數可以是任何型別，傳送的資料格式必須為
// 這樣的格式：name=value&anothername=othervalue&so=on，如果你想傳送資料，你必須更改MIME型別：
// httpRequest.setRequestHeader('Content-type','application/x-www-form-urnlencoded');
// 否則伺服器將會丟棄傳送的資料。
function getBackInfo()
{
var username=document.getElementById("username").value;
var url='checkUser.jsp?username='+username;
request.open("GET",url,"true");
//下面相當於是一個隱性的迴圈，在函式中規定只有都接收完畢資料後才做處理
//onreadystatechange有5個值：
// 0:未初始化
// 1:初始化
// 2:傳送資料
// 3:接收資料中
// 4:資料接收完畢
//另外還要注意就是在註冊回撥函式onreadystatechange時，後面的函式不能夠帶引數
//如下disResult是一個函式，不能夠帶參。
reqeust.onreadystatechange=disResult;//隱性的迴圈
request.send(null);
}
function disResult()
{
//1.一定要確定readystate==4的完成狀態才做下面的事，否則會在建立連線即readystate==1的時候就開始，
// 然後會在readystate==2，readystate==3，readystate==4的時候都會執行，不信你可以alert("")一個
// 提示資訊試試。
//2.伺服器通知完成了，並且還要保證是正確完成的，得到的是我們需要的結果才能夠繼續，這裡常用響應碼有：
// 200:成功執行
// 401:未授權
// 403:禁止
// 404:沒有找到檔案
if(request.readystate==4)
{
if(request.status==200)
{
//一切都OK了，那就該用Javascript去執行你想要的動作了。
document.getElementById("disCheckResult").value=request.responseText;
alert('done');
}
else
{
alert('Something Wrong has Happend!');
}
}
}
</script>
</head>
<body>
<form>
<table>
<tr>
<td>
<input type=text id="username" onblur="getBackInfo();">
</td>
<td>
<dd id="disCheckResult">這裡用於在執行後顯示結果的地方</dd>
</td>
</tr>
</table>
</form>
</body>
</html>