jQuery中$.get、$.post、$.getJSON和$.ajax的用法詳解

本章重點在於來講講jQuery中呼叫ajax的4種方法：$.get、$.post、$getJSON、$ajax。

當我們用javascript寫ajax程式寫得很「開心」的時候，突然有人告訴你有一種東西叫jquery，它會告訴你不直接和HttpRequest是多麼的快樂，同時你再也不需要再煩惱糾結的ajax亂碼問題，更幸福的是你的js程式碼將大大簡化，看完本文，你會發現，ajax，簡單的來講就是一句話的事情。

1、$.get

$.get()方法使用GET方式來進行非同步請求，它的語法結構為：

$.get( url [, data] [, callback] );

解釋一下這個函數的各個參數：

url：string類型，ajax請求的位址。

data：可選參數，object類型，發送至伺服器的key/value資料會作為QueryString附加到請求URL中。

callback：可選參數，function類型，當ajax回傳成功時自動呼叫函數。

最後寫一個$.get()的實例給大家參考：

$.get(
    "submit.aspx",{
        id:     '123',
        name:   '青藤园',
    },function(data,state){
        //这里显示从服务器返回的数据
        alert(data);
        //这里显示返回的状态
        alert(state);
    }
)

2、$.post()

$.post()方法使用POST方式來進行非同步請求，它的語法結構為：

$.post(url,[data],[callback],[type]);

這個方法和$.get()用法差不多，唯獨多了一個type參數，那麼這裡就只介紹type參數吧，其他的參考上面$.get()的。

type：type為請求的資料類型，可以是html,xml,json等類型，如果我們設定這個參數為：json，那麼傳回的格式則是json格式的，如果沒有設定，就和$.get()傳回的格式一樣，都是字串的。

最後寫一個$.post()的實例供大家參考：

$.post(
    "submit.aspx",{
        id:     '123',
        name:   '青藤园',
    },function(data,state){
        //这里显示从服务器返回的数据
        alert(data);
        //这里显示返回的状态
        alert(state);
    },
    "json"
)

3、$.getJSON()

$. getJSON()是專門為ajax獲取json資料而設定的，並且支援跨域調用，其語法的格式為：

getJSON(url,[data],[callback]);

url：string類型， 發送請求地址  data ：可選參數， 待傳送Key/value 參數，同get，post類型的data callback ：可選參數，載入成功時回呼函數，同get，post類型的callback

JSON是一種理想的資料傳輸格式，它能夠很好的融合與JavaScript或其他宿主語言，並且可以被JS直接使用。使用JSON相比傳統的透過 GET、POST直接發送「裸體」數據，在結構上更為合理，也更為安全。至於jQuery的getJSON()函數，只是設定了JSON參數的 ajax()函數的一個簡化版本。這個函數也是可以跨域使用的，比起get()、post()有一定優勢。另外這個函數可以透過把請求url寫 成"myurl?callback=X"這種格式，讓程式執行回呼函數X。

4、$.ajax()

$.ajax()是jquery中通用的一個ajax封裝，其語法的格式為：

$.ajax(options);

其中options是一個object類型，它指明了本次ajax呼叫的具體參數，這裡我把最常用的幾個參數附上

$.ajax({
        url: 'submit.aspx',
        datatype: "json",
        type: 'post',
        success: function (e) {   //成功后回调
            alert(e); 
        },
        error: function(e){    //失败后回调
            alert(e);
        },
        beforeSend: function(){  /发送请求前调用，可以放一些"正在加载"之类额话
            alert("正在加载");
        }
})

以上就是jquery實作ajax呼叫的幾種方法，ajax調用還挺複雜的，希望本章能對大家有所幫助，更多相關教程請訪問jQuery視頻教程，AJAX視頻教程！