基於對XML的學習，想好好的學習一下AJAX。剛剛學習一個入門，模仿書中的例子，實踐一下先。
jsp頁面
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html> <head>
<script type="text/javascript">
function ajaxSubmit(path){
// 獲取留言相關信息 var name = document.forms[0].name.value; var email = document.forms[0].email.value; var title = document.forms[0].title.value; var content = document.forms[0].content.value; // 創建XMLHttpRequest對象 var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); // new XMLHttpRequest(); // 創建請求結果處理程序 xmlhttp.onreadystatechange = function(){ if(xmlhttp.readyState==4 && xmlhttp.status==200){ var date = xmlhttp.responseText; addMsg(date);
} } // 打開連接，true表示異步提交 xmlhttp.open("post",path+"/add.do",true); // 當方法爲post時需要如下設置http頭 xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); // 發送數據 xmlhttp.send("name="+escape(name)+"&email="+escape(email)+"&title="+escape(title)+"&content="+escape(content)); } // 添加留言信息的方法 function addMsg(date){ // 獲取留言DIV的容器 var msg = document.getElementById("msgList"); // 創建新標籤 var dl = document.createElement("dl"); var dt = document.createElement("dt"); var ddname = document.createElement("dd"); var ddcontent = document.createElement("dd"); // 插入標籤 msg.insertBefore(dl,msg.firstChild); dl.appendChild(dt); dl.appendChild(ddname); dl.appendChild(ddcontent); dt.innerHTML = "標題："+document.forms[0].title.value; ddname.innerHTML = "留言者："+document.forms[0].name.value+" 時間：" + date; ddcontent.innerHTML = document.forms[0].content.value; // 清空輸入信息 document.forms[0].name.value=""; document.forms[0].title.value=""; document.forms[0].email.value=""; document.forms[0].content.value=""; }
</script> </head> <body> <div id="msgList"> <!--初始化頁面時，顯示從數據庫讀取數據 --> </div> <div id="postBox"> <form action="/add.do"> <dl> <dt>如果你有任何評論、問題、建議，請發郵件給我:</dt> <dd>姓名:<input type="text" maxlength="150" size="45" name="name"/></dd> <dd>Email:<input type="text" maxlength="150" size="45" name="email"/></dd> <dd>標題：<input type="text" maxlength="150" size="45" name="title"/></dd> <dd>內容<textarea rows="10" cols="45" name="content"></textarea></dd> <dd> <input type="button" onclick="ajaxSubmit('<%=request.getContextPath()%>');" value="發送留言" /> </dd> </dl> </form> </div> </body>AddAction.java
package com.realsmy.mytangs.action;import java.io.IOException;import java.io.PrintWriter;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import org.apache.struts.action.Action;import org.apache.struts.action.ActionForm;import org.apache.struts.action.ActionForward;import org.apache.struts.action.ActionMapping;public class AddAction extends Action { public ActionForward execute(ActionMapping mapping, ActionForm form, HttpServletRequest request, HttpServletResponse response) { String name = request.getParameter("name"); String email = request.getParameter("email"); String title = request.getParameter("title"); String content = request.getParameter("content"); // 與數據庫交互進行處理，省略。 PrintWriter out = null; try { out = response.getWriter(); } catch (IOException e) { e.printStackTrace(); } out.print("2007-09-15"); return null; }}這是對基於AJAX的開發模式的簡單理解。
記錄於此，繼續學習。