ajax的配置詳情、ajax的調用解釋、ajax的中文亂碼和ajax的表單提交（內有執行個體）

本篇文章主要的講述了關於ajax的使用總結說明，還有ajax的配置、調用、中文亂碼、表單提交等等詳細解釋，現在我們一起來看這篇文章吧

·jquery的使用
0、必須優先引入jquery.js 否則無法調用jquery架構
1、js區分大小寫，起名字的時候要注意
2、jquery根據p的id屬性擷取頁面text的值：$("#demoID").val()，根據class屬性擷取頁面text的值$(".demoCLASS").val(),如果是賦值$("#demoID").val("賦值的參數")
3、$(document).ready(function(){代碼})、$().ready(function(){代碼})、$(function(){代碼})的含義一樣
4、多個$(function(){代碼})可以並存，即只要名字不重複可以同時發揮作用
5、$(function(){代碼})的意思是頁面載入完畢即運行，比如自動點擊，自動彈框，再或者點擊監聽或者其他監聽
6、載入完即點擊和“點擊的監聽”的區別（非常有借鑒意義）
比如現在有一個js方法，function demoFunction(){alert("這個方法運行了");};
載入完即點擊：$("#demoid").click(demoFunction());
載入完後即監聽，這個方法只能是在按鈕有click這個動作，或者通過jquery有click()動作：$("#demoid").click(function(){demoFunction()});
7、如果是自動載入即啟動並執行，或者需要被監聽的都需要放置到$(document).ready(function(){代碼})的代碼中
8、window.onload=function(){代碼}與$(function(){代碼})的區別
·調用函數的用法不同：
window.onload = function(){代碼};
$(function(){代碼})
·調用函數的時間不同
window.load=function(){代碼}：必須等待網頁中所有的內容載入完畢（包括圖片）才能執行，比如要運用上傳等功能。
$(function(){代碼})，等到網頁中所有的DOM結構繪製完畢後就可以執行。
9、AJAX專題
·需要的jar包：commons-lang-2.5.jar、commons-lang3-3.1.jar、javassist-3.11.0.GA.jar
·前台js的寫法：為了簡化流程，寫成頁面載入即運行
$(document).ready(function(){
$.ajax({

url : "testajax.do",// 請求地址//timeout : 600000,//逾時時間設定，單位毫秒async : false,// 非同步cache : false,// 緩衝type : 'post',// 請求方式data: {"name":"123"},//data: $('#formid').serialize(),//序列化表單-當觸發一個form表單提交的ajax事件的時候，這個序列化方法自動將資料轉化為json格式傳遞給後台dataType : 'json',// 伺服器返回的資料類型success : function(msg) {// 請求成功後調用的alert("返回json的實驗成功了"+" msg.resultcode="+msg.resultcode+" msg.name="+msg.name);},error :function(){alert("異常");}});      });

·struts.xml檔案的寫法

      <?xml version="1.0" encoding="UTF-8"?>      <!DOCTYPE struts PUBLIC    "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN"    "http://struts.apache.org/dtds/struts-2.3.dtd">    <struts>    <!--略去一些struts2的配置資訊--><package name="myajax" extends="json-default" namespace="/"><global-results><result name="message" type="json"><param name="root">message</param></result></global-results><action name="*" class="demo.action.AjaxTest" method="{1}">        <result name="list">/index.jsp</result>       </action></package> <!-- 包含的其他設定檔 --><include file="struts-method.xml"></include>    </struts>

·後台java代碼：僅距離調用ajax，故不涉及資料庫操作

    import java.io.IOException;    import java.io.PrintWriter;    import java.util.HashMap;    import java.util.Map;    import javax.servlet.http.HttpServletResponse;    import org.apache.struts2.ServletActionContext;    public class AjaxTest {protected Map<String, Object> message = new HashMap<String, Object>();/** AJAX請求返回RESULT的name常量*/protected final static String MESSAGE = "message";public Map<String, Object> getMessage() {return message;}public void setMessage(Map<String, Object> message) {this.message = message;}//-登入頁面中form表單提交的路徑public String testajax() throws IOException{System.out.println("擷取參數name="+ServletActionContext.getRequest().getParameter("name"));message.put("resultcode", "0000");message.put("resultcode", "0001");message.put("name", "zhong文ce試");return MESSAGE;}     }

·ajax的應用之提交form表單資料-表單資料自動轉json格式
情境描述：當具體的提交資訊為一個form表單，並通過ajax傳遞給後台時，我們通常使用一個叫序列化的方法將這個form表單轉化為json格式傳遞給後台。（想看更多就到topic.alibabacloud.comAJAX開發手冊欄目中學習）

·form表單的格式，form標籤有id，input標籤有name

     <form  id="formid"> 姓名：<input type="text" name="name" value="張三"/><br>年齡：<input type="text" name="age" value="12"/><br><input type="submit" value="提交" id="submitid"/>     </form>

·js部分的代碼-可以單獨寫在一個js檔案，注意，需要先引入jquery.js檔案

   $(document).ready(function(){$("#submitid").click(function(){ajaxhere()});});     //提交表單的ajax    function ajaxhere(){$.ajax({url : "testajax3.do",// 請求地址//timeout : 600000,//逾時時間設定，單位毫秒async : false,// 非同步cache : false,// 緩衝type : 'post',// 請求方式data: $('#formid').serialize(),//序列化表單dataType : 'json',// 伺服器返回的資料類型//contentType:"application/x-www-form-urlencoded; charset=utf-8",success : function(msg) {// 請求成功後調用的alert("form表單觸發的實驗成功了"+" msg.resultcode"+msg.resultcode+"  msg.name="+msg.name);},error :function(){alert("異常");}});};             ·傳統的ajax返回方式，即java部分的返回寫在流裡-特別要注意這裡的處理中文亂碼的解決方式HttpServletResponse response = ServletActionContext.getResponse();response.setCharacterEncoding("utf-8");PrintWriter writer = response.getWriter();String a = "{\"resultcode\":\"0000\",\"name\":\"文試\"}";writer.write(a);writer.flush();writer.close();

本篇文章到這就結束了（想看更多就到topic.alibabacloud.comAJAX使用手冊欄目中學習），有問題的可以在下方留言提問。