今天在各種資源的幫助下，做了一個小AJAX程序。共享出來，以備後用。其中很多都是不完善的，還望指點。
程序實現一個功能，在文本框內容變化的時候，下面顯示不同的內容。
1,先做了一個返回XML文件的JSP。
data.jsp
<%@ page language="java" contentType="text/xml; charset=UTF-8" import="java.util.*" pageEncoding="UTF-8"%><%
//獲得傳入的參數值 String name = request.getParameter("name"); out.println("<?xml version="1.0" encoding="UTF-8"?>"); out.println("<results>"); if ("a".equals(name)){ out.println("<rs>my1</rs>"); }else{ if("b".equals(name)){ out.println("<rs>my2</rs>"); }else{ out.println("<rs>my3</rs>"); }}
out.println("</results>"); 
%>在傳入的參數值不同的情況下，返回不同的XML。
傳入a情況下，返回
<?xml version="1.0" encoding="UTF-8" ?> <results><rs>my1</rs> </results>傳入b情況下，返回
<?xml version="1.0" encoding="UTF-8" ?> <results><rs>my2</rs> </results>傳入c情況下，返回
<?xml version="1.0" encoding="UTF-8" ?> <results><rs>my3</rs> </results>2,主體部分。
先看一下整個JSP文件。
MyAjax.jsp
<%@ page language="java" import="java.util.*" pageEncoding="GB18030"%><html> <head> <title>My JSP 'MyAjax.jsp' starting page</title> <script type="text/javascript">
function ajaxtest(){
//新建XMLHttpRequest對象//適合firefox之類 if (window.XMLHttpRequest) { var myXmlhttp = new XMLHttpRequest(); }else{//適全IE的 var myXmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} var name = document.getElementById("text1");//打開XMLHttpRequest對象 myXmlhttp.open("GET","http://localhost:8080/jsptest/data.jsp?name="+name.value,true);//下面這個用法，見注1 myXmlhttp.onreadystatechange = function() { if(myXmlhttp.readyState == 4&&myXmlhttp.status == 200){ DoMyXML(myXmlhttp); } } myXmlhttp.send(null); } function DoMyXML(xmlObj) { var rtnvalue; var xmlDoc = xmlObj.responseXML; rtnvalue=xmlDoc.getElementsByTagName("rs")[0].firstChild.data; text2.innerHTML = rtnvalue; } </script> </head> <body> <table> <tr> <td> <input type="text" name="text1" id="text1" onBlur="ajaxtest();"> <div id="text2"></div> </td> </tr> </table> </body></html>注1：
事件：每當readyState的值發生改變時，就是產生了一個事件。事件處理的函數句柄：我們可以選擇在事件產生以後，如何處理。這個處理的函數，我們必須告訴這個XMLHttpRequest對象。這裏借用了C語言中的函數句柄的概念。將這個函數的句柄，在JavaScript中也就是這個函數的名稱，賦值給XMLHttpRequest對象中的onreadystatechange，就可以了。（注：這裏其實是創建了一個匿名的函數，onreadystatechange只是屬性名稱，而不是函數名稱。函數在JavaScript中是第一等的對象，可以賦值給任何變量。Java開發人員尤其需要注意！）