概述
Ajax用於瀏覽器與服務器通信而無需刷新整個頁面，服務器將不再返回整個頁面，而是返回少量數據，通過JavaScript DOM更新一部分節點。期間數據傳輸可采用xml，json等格式，Ajax最早用於谷歌的搜索提示。
其實不刷新整個頁面便可與服務器通信的方法有很多，比如Flash，Java applet，iframe等，但Ajax是目前最為常見的一種。
我們可以使用JavaScript擴展對象XMLHttpRequest實現Ajax，對於這種方法在這里不做介紹，下面直接了解jQuery實現Ajax的幾種方法。
數據格式
瀏覽器與服務器之間傳輸數據所采用的格式，比較常見的有xml，html，text，json，jsonp等，目前json由於占用更小存儲，且是JavaScript原生格式，因此很受歡迎。
當確定數據傳輸采用json格式后，下面就需要考慮序列化問題了。
網絡中傳輸的都是文本字符串（其實是二進制比特流，這里方便理解），因此在向網絡通道中寫入數據時，都需要先序列化json對象為文本字符串。而從網絡通道中讀取數據時，都需要反序列化文本字符串為json對象。在Python中json.dumps用於序列化，json.loads用於反序列化。
如果確定數據格式是json，JS也需對服務器返回的數據進行反序列化，即把json樣式的字符串變成json對象。
var json_str = '{"result": "hello, world!"}';
var json_object = eval("(" + json_str + ")"); // 法一，使用eval函數，注意括號
var json_object = jQuery.parseJSON(json_str); // 法二，使用jQuery的parseJSON函數
alert(json_object.result); // 反序列化成功，輸出結果
下面就引出jQuery中發送Ajax請求的幾個常見方法。
$.ajax()
該方法用於執行Ajax請求，常用於其他jQuery Ajax方法不能完成的請求，也許我們可以把它稱為"jQuery中Ajax系列方法之母"。
形式：$.ajax({name:val, name:val,...});
可選字段：
1）url：鏈接地址，字符串表示
2）data：需發送到服務器的數據，GET與POST都可以，格式為{A: '...', B: '...'}
3）type："POST" 或 "GET"，請求類型
4）timeout：請求超時時間，單位為毫秒，數值表示
5）cache：是否緩存請求結果，bool表示
6）contentType：內容類型，默認為"application/x-www-form-urlencoded"
7）dataType：服務器響應的數據類型，字符串表示；當填寫為json時，回調函數中無需再對數據反序列化為json
8）success：請求成功后，服務器回調的函數
9）error：請求失敗后，服務器回調的函數
10）complete：請求完成后調用的函數，無論請求是成功還是失敗，都會調用該函數；如果設置了success與error函數，則該函數在它們之后被調用
11）async：是否異步處理，bool表示，默認為true；設置該值為false后，JS不會向下執行，而是原地等待服務器返回數據，並完成相應的回調函數后，再向下執行
12）username：訪問認證請求中攜帶的用戶名，字符串表示
13）password：返回認證請求中攜帶的密碼，字符串表示
不知道將最后兩個放到data中去，是不是密碼會以明文展示，因沒有嘗試過，這里不敢下結論。
舉例：
$.ajax({
url: "/greet",
data: {name: 'jenny'},
type: "POST",
dataType: "json",
success: function(data) {
// data = jQuery.parseJSON(data); //dataType指明了返回數據為json類型，故不需要再反序列化
...
}
});
$.post()
該方法使用POST方式執行Ajax請求，從服務器加載數據。
形式：$.post(url, data, func, dataType);
可選參數：
1）url：鏈接地址，字符串表示
2）data：需要發送到服務器的數據，格式為{A: '...', B: '...'}
3）func：請求成功后，服務器回調的函數；function(data, status, xhr)，其中data為服務器回傳的數據，status為響應狀態，xhr為XMLHttpRequest對象，個人感覺關注data參數即可
4）dataType：服務器返回數據的格式
舉例：
$.post(
"/greet",
{name: 'Brad'},
function(data) {
...
},
"json"
);
$.get()
該方法使用GET方式執行Ajax請求，從服務器加載數據。
形式：$.get(url, data, func, dataType);
其各個參數所示意義與$.post()一致，在此不再列出，唯一區別就是請求類型是GET。
舉例：
$.get(
"/greet",
{name: 'Brad'},
function(data) {
...
},
"json"
);
上面三個是jQuery中發送Ajax請求較為重要的方法，下面再選擇三個較為常見的方法，簡單做解釋。
$.getJSON()
該方法使用GET方式執行Ajax請求，從服務器加載JSON格式數據。
形式：$.getJSON(url, data, func);
因為確定服務器返回json編碼的數據，故相較於$.get()不必再指定dataType。
舉例：
$.getJSON(
"/greet",
{name: 'jenny'},
function(data) {
...
}
);
$.load()
該方法將服務器加載的數據直接插入到指定DOM中。
形式：$.load(url, data, func);
其中data如果存在則使用POST方式發送請求，不存在則使用GET方式發送請求。
舉例：
<div id="ret"></div>
$('#ret').load(
"/greet",
{name: 'Brad'}
);
$.getScript()
該方法使用GET方式執行Ajax請求，從服務器加載並執行回傳的JavaScript。
形式：$.load(url, func);
<html>
<body>
<button οnclick="login1()">發送1</button>
<button οnclick="login2()">發送2</button>
<button οnclick="login3()">發送3</button>
<button οnclick="login4()">發送4</button>
<button οnclick="login5()">發送5</button>
<div id="ret"></div>
<script type="text/javascript" src="{{ url_for('static', filename='jquery.min.js') }}"></script>
<script type="text/javascript">
function login1() {
$.ajax({
url: "{{ url_for('greet') }}",
data: {name: 'jenny'},
type: "POST",
//dataType: "json",
success: function(data) {
// data = eval("(" + data+ ")");
data = jQuery.parseJSON(data); // dataType注釋了，故注意反序列化
$("#ret").text(data.result);
}
});
}
function login2() {
$.get(
"{{ url_for('greet') }}",
{name: 'Brad'},
function(data) {
$("#ret").text(data.result);
},
"json"
);
}
function login3() {
$.getJSON(
"{{ url_for('greet') }}",
{name: 'jenny'},
function(data) {
$("#ret").text(data.result);
}
);
}
function login4() {
$.post(
"{{ url_for('greet') }}",
{name: 'Brad'},
function(data) {
$('#ret').text(data.result);
},
"json"
);
}
function login5() {
$('#ret').load(
"{{ url_for('greet') }}",
{name: 'Brad'}
);
}
</script>
</body>
</html>