要求爲==String==類型的參數,(默認爲當前頁地址)==發送請求的地址==。javascript
要求爲==String==類型的參數,請求方式==(post或get)默認爲get==。注意其餘http請求方法,例如put和delete也可使用,但僅部分瀏覽器支持。html
要求爲==Number==類型的參數,設置==請求超時時間(毫秒)==。此設置將覆蓋$.ajaxSetup()方法的全局設置。java
要求爲==Boolean==類型的參數,默認設置爲==true==,全部請求均爲==異步請求==。若是須要發送==同步==請求,請將此選項設置爲==false==。注意,同步請求將鎖住瀏覽器,用戶其餘操做必須等待請求完成才能夠執行。jquery
要求爲==Boolean==類型的參數,默認爲==true==(當dataType爲script時,默認爲false),設置爲false將不會從瀏覽器緩存中加載請求信息。web
要求爲==Object或String==類型的參數,發送到服務器的數據。若是已經不是字符串,將==自動轉換爲字符串格式==。==get請求中將附加在url後==。防止這種自動轉換,能夠查看==processData(防止自動轉換)選項==。對象必須爲key/value格式,例如{foo1:"bar1",foo2:"bar2"}轉換爲&foo1=bar1&foo2=bar2。若是是數組,JQuery將自動爲不一樣值對應同一個名稱。例如{foo:["bar1","bar2"]}轉換爲&foo=bar1&foo=bar2。ajax
要求爲==String==類型的參數,==預期服務器返回的數據類型==。若是==不指定==,JQuery將自動根據http包mime信息==返回responseXML或responseText==,並做爲回調函數參數傳遞。可用的類型以下: xml:返回XML文檔,可用JQuery處理。 html:返回純文本HTML信息;包含的script標籤會在插入DOM時執行。 script:返回純文本JavaScript代碼。不會自動緩存結果。除非設置了cache參數。注意在遠程請求時(不在同一個域下),全部post請求都將轉爲get請求。 json:返回JSON數據。 jsonp:JSONP格式。使用SONP形式調用函數時,例如myurl?callback=?,JQuery將自動替換後一個「?」爲正確的函數名,以執行回調函數。 text:返回純文本字符串。spring
這個參數主要是爲了在向服務器==發送請求前,執行一些操做==。要求爲Function類型的參數,發送請求前==能夠修改XMLHttpRequest對象==的函數,例如添加自定義HTTP頭。在beforeSend中若是返回false能夠取消本次ajax請求。XMLHttpRequest對象是唯一的參數。 function(XMLHttpRequest){ this; //調用本次ajax請求時傳遞的options參數 }json
要求爲Function類型的參數,請求完成後調用的回調函數(請求成功或失敗時均調用)。參數:XMLHttpRequest對象和一個描述成功請求類型的字符串。 function(XMLHttpRequest, textStatus){ this; //調用本次ajax請求時傳遞的options參數 }數組
要求爲==Function==類型的參數,==請求成功後調用==的回調函數,有兩個參數。 (1)由服務器返回,並根據dataType參數進行處理後的數據。 (2)描述狀態的字符串。 function(data, textStatus){ //data多是xmlDoc、jsonObj、html、text等等 this; //調用本次ajax請求時傳遞的options參數 }瀏覽器
要求爲==Function==類型的參數,==請求失敗時被調用==的函數。該函數有3個參數,即XMLHttpRequest對象、錯誤信息、捕獲的錯誤對象(可選)。ajax事件函數以下: function(XMLHttpRequest, textStatus, errorThrown){ //一般狀況下textStatus和errorThrown只有其中一個包含信息 this; //調用本次ajax請求時傳遞的options參數 }
要求爲==String==類型的參數,當發送信息至服務器時,內容編碼類型默認爲=="application/x-www-form-urlencoded"==。該默認值適合大多數應用場合。
要求爲==Function==類型的參數,給Ajax返回的原始數據進行==預處理==的函數。提供data和type兩個參數。data是Ajax返回的原始數據,type是調用jQuery.ajax時提供的dataType參數。函數返回的值將由jQuery進一步處理。 function(data, type){ //返回處理後的數據 return data; }
要求爲==Boolean==類型的參數,默認爲==true==。表示==是否觸發全局ajax事件==。設置爲false將不會觸發全局ajax事件,ajaxStart或ajaxStop可用於控制各類ajax事件。
要求爲==Boolean==類型的參數,默認爲false。==僅在服務器數據改變時獲取新數據==。服務器數據改變判斷的依據是Last-Modified頭信息。默認值是false,即忽略頭信息。
要求爲==String==類型的參數,在一個jsonp請求中==重寫回調函數的名字==。該值用來替代在"callback=?"這種GET或POST請求中URL參數裏的"callback"部分,例如{jsonp:'onJsonPLoad'}會致使將"onJsonPLoad=?"傳給服務器。
要求爲==String==類型的參數,用於響應HTTP訪問認證請求的用戶名。
要求爲==String==類型的參數,用於響應HTTP訪問認證請求的密碼。
要求爲==Boolean==類型的參數,默認爲true。默認狀況下,發送的數據將被轉換爲對象(從技術角度來說並不是字符串)以配合默認內容類型"application/x-www-form-urlencoded"。若是要發送DOM樹信息或者其餘不但願轉換的信息,請設置爲false。
要求爲==String==類型的參數,只有當請求時dataType爲"jsonp"或者"script",而且type是GET時纔會用於強制修改字符集(charset)。一般在本地和遠程的內容編碼不一樣時使用。
文字源於:https://www.cnblogs.com/huiyuantang/p/5458278.html
代碼源於自我創做XING_Gou
實踐檢驗整理+
<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>XING_Gou</title> <!--引入jQuery的函數類庫 --> <script type="text/javascript" src="/js/jquery-3.4.1.min.js"></script> <!--jQuery測試 --> <script type="text/javascript"> //讓整個頁面加載完成.以後執行js $(function() { //0.0測試jQuery函數類庫是否引入成功 //alert("jQuery調用成功!!!"); /*get post getJSON ajax 業務描述: 當頁面在展示時,調用ajax獲取用戶數據.利用html標籤在表格中 展示數據. */ /** 1.$.get(url,params,callback,dataType); 參數說明: 1.url 用戶請求地址信息. 2.params,用戶提交的參數,若是沒有參數時,能夠省略. 3.callback 回調函數,當程序正確的獲取返回值時執行回調函數. 4.dataType 返回值數據類型. text/json/html/script 該屬性能夠省略不寫 */ $.get("/ajaxUser2", { "id" : "1", "name" : "tomcat" }, function(result) { //1.0alert("當執行回調函數時,標識業務調用正常!!!"); //1.1利用js遍歷返回值數據 /* for(var i=0;i<result.length;i++){ //result返回值是數組 獲取其中的一個元素. var user = result[i]; alert(user.name); } */ //1.2利用jQuery的遍歷方式 //arg0=index表明下標 從0開始, //arg1=obj 表明當前正在遍歷的對象信息 $(result).each( function(index, user) { //var user = result[index]; //obj var id = user.id; var name = user.name; var age = user.age; var sex = user.sex; var tr = "<tr align='center'><td>" + id + "</td><td>" + name + "</td><td>" + age + "</td><td>" + sex + "</td></tr>"; //jQuery中的追加函數 append(); $("#tab").append(tr); }); }); //2.ajax參數提交的方式 1.json串 2.key=value結構 $.get("/ajaxUserGet", "id=1&name=tomcat", function(result) { }); $.post("/ajaxUserPost", "id=1&name=tomcat", function(result) { }); //3.動態獲取的遠程的 1JSON串 2JSON對象 3JS對象 //問題:result 後臺服務器返回的JSON串,問題JS竟然能夠 result.屬性調用. $.getJSON("/ajaxGetJSON", "id=1&name=tomcat", function(result) { //利用jQuery進行數據的轉化. var userList = $(result) }); //ajax的調用是最爲根本的方式.$.ajax能夠實現用戶的所有的需求. //例如:設定成功/失敗的調用方式.2能夠設定請求頭信息 3.能夠設定字符集編碼格式 //設定調用是否同步/異步. 該方法的功能最爲強大. //定義了js對象 {key:value} /* function user = { id:1, name:"tomcat", sex:"男" } */ $.ajax({ url : "/ajaxUser", //請求地址信息 type : "get", //請求方式 //method:"get", data : {id : 1}, //請求參數 dataType : "json", //返回值結果 要求JSON串 //成功的回調 success : function(result) { $(result).each( function(index, user) { //var user = result[index]; //obj var id = user.id; var name = user.name; var age = user.age; var sex = user.sex; var tr = "<tr align='center'><td>" + id + "</td><td>" + name + "</td><td>" + age + "</td><td>" + sex + "</td></tr>"; //jQuery中的追加函數 append(); $("#tab").append(tr); }); }, //報錯回調 error : function(result) { alert("後臺服務器異常!!!!!!"); } }); }) </script> </head> <body> <table id="tab" border="1px" width="65%" align="center"> <tr> <td colspan="6" align="center"><h3>學生信息</h3></td> </tr> <tr> <th>編號</th> <th>姓名</th> <th>年齡</th> <th>性別</th> </tr> </table> </body> </html>
在jsp中,你能夠從0.0開始起步,到後面的3,我相信你將會有很是多的收穫
$.ajax()
ajax的調用是最爲根本的方式.$.ajax能夠實現用戶的所有的需求. 例如:
package com.jt.demo.controller; import java.util.List; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Controller; import org.springframework.ui.Model; import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.bind.annotation.ResponseBody; import com.jt.demo.pojo.User; import com.jt.demo.service.UserService; @Controller @RequestMapping("/") public class UserController { @Autowired private UserService userService; /** * 實現ajax頁面跳轉 * @return */ @RequestMapping("/ajax") public String ajax() { return "userAjax"; } /** * 接收ajax的用戶請求 * url:ajaxUser * 參數:沒有省略 * 返回值:用戶列表信息 */ @RequestMapping("/ajaxUser") @ResponseBody //將數據轉化爲json格式 public List<User> findAjaxUser(){ return userService.findAll(); } }
在代碼中我只測試了$.get()和.ajax() 其他方法基本一致,若想測試更改@RequestMapping("/ajaxUser")中路徑url或從新添加皆可