基于對XML的學(xué)習(xí)，想好好的學(xué)習(xí)一下AJAX。剛剛學(xué)習(xí)一個入門，模仿書中的例子，實踐一下先。
          

          
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){
          
                // 獲取留言相關(guān)信息
          
                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;
          
                // 創(chuàng)建XMLHttpRequest對象
          
                var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
          
                // new XMLHttpRequest();
          
                // 創(chuàng)建請求結(jié)果處理程序
          
                xmlhttp.onreadystatechange = function(){
          
                  if(xmlhttp.readyState==4 && xmlhttp.status==200){   
          
                    var date = xmlhttp.responseText;
          
          addMsg(date);
          
        }
          
      }
          
                // 打開連接，true表示異步提交
          
                xmlhttp.open("post",path+"/add.do",true);
          
                // 當(dāng)方法為post時需要如下設(shè)置http頭
          
                xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');     
          
                // 發(fā)送數(shù)據(jù)
          
                xmlhttp.send("name="+escape(name)+"&email="+escape(email)+"&title="+escape(title)+"&content="+escape(content));
          
    }
          
              // 添加留言信息的方法
          
              function addMsg(date){
          
                // 獲取留言DIV的容器
          
                var msg = document.getElementById("msgList");
          
                // 創(chuàng)建新標(biāo)簽
          
                var dl = document.createElement("dl");
          
                var dt = document.createElement("dt");
          
                var ddname = document.createElement("dd");
          
                var ddcontent = document.createElement("dd");
          
                // 插入標(biāo)簽
          
                msg.insertBefore(dl,msg.firstChild);
          
      dl.appendChild(dt);
          
      dl.appendChild(ddname);
          
      dl.appendChild(ddcontent);
          
      dt.innerHTML           = "標(biāo)題："+document.forms[0].title.value;
          
      ddname.innerHTML           = "留言者："+document.forms[0].name.value+"&nbsp;時間：" + 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">
          
              <!--初始化頁面時，顯示從數(shù)據(jù)庫讀取數(shù)據(jù)  -->
          
              </div>
          
              <div id="postBox">
          
                <form action="/add.do">
          
                  <dl>
          
                    <dt>如果你有任何評論、問題、建議，請發(fā)郵件給我:</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>標(biāo)題：<input type="text" maxlength="150" size="45" name="title"/></dd>
          
                    <dd>內(nèi)容<textarea rows="10" cols="45" name="content"></textarea></dd>
          
                    <dd>
          
                      <input type="button" onclick="ajaxSubmit('<%=request.getContextPath()%>');" value="發(fā)送留言" />
          
                    </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");
          
                  // 與數(shù)據(jù)庫交互進(jìn)行處理，省略。
          
                  PrintWriter out = null;
          
                  try {
          
            out           = response.getWriter();
          
        }           catch (IOException e) {
          
            e.printStackTrace();
          
        }
          
        out.print(          "2007-09-15");
          
                  return null;
          
    }
          

          
}
          

          

          
這是對基于AJAX的開發(fā)模式的簡單理解。
          

          
記錄于此，繼續(xù)學(xué)習(xí)。 


          歡迎來訪！^.^!
          
本BLOG僅用于個人學(xué)習(xí)交流!
          
目的在于記錄個人成長.
          
所有文字均屬于個人理解.
          
如有錯誤，望多多指教！不勝感激！
          

          
	
          


          
	    
    




          








          

				
          
	
	
	

          
	
          
	
          Copyright © 久城
          

          

          

    







          
        
	




主站蜘蛛池模板：
云南省|
石家庄市|
雷山县|
崇礼县|
甘谷县|
砀山县|
疏附县|
平陆县|
沈阳市|
湖南省|
忻城县|
新龙县|
营山县|
锦屏县|
澄迈县|
宜州市|
聊城市|
革吉县|
汕头市|
彭泽县|
清苑县|
三穗县|
台前县|
嘉兴市|
大关县|
长泰县|
山阳县|
洪泽县|
中宁县|
偃师市|
柳林县|
惠州市|
航空|
龙泉市|
宜州市|
申扎县|
库尔勒市|
河西区|
辉南县|
石景山区|
新昌县|