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

一、$.gethtml

$.get()方法使用GET方式來進行異步請求,它的語法結構爲:jquery

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

解釋一下這個函數的各個參數:json

url:string類型,ajax請求的地址。跨域

data:可選參數,object類型,發送至服務器的key/value數據會做爲QueryString附加到請求URL中。安全

callback:可選參數,function類型,當ajax返回成功時自動調用該函數。服務器

最後寫一個$.get()的實例供你們參考:異步

1函數

2post

3

4

5

6

7

8

9

10

11

$.get(

    "submit.aspx",{

        id:     '123',

        name:   '青藤園',

    },function(data,state){

        //這裏顯示從服務器返回的數據

        alert(data);

        //這裏顯示返回的狀態

        alert(state);

    }

)

二、$.post()

$.post()方法使用POST方式來進行異步請求,它的語法結構爲:

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

這個方法和$.get()用法差很少,惟獨多了一個type參數,那麼這裏就只介紹type參數吧,其餘的參考上面$.get()的。

type:type爲請求的數據類型,能夠是html,xml,json等類型,若是咱們設置這個參數爲:json,那麼返回的格式則是json格式的,若是沒有設置,就和$.get()返回的格式同樣,都是字符串的。

最後寫一個$.post()的實例供你們參考:

1

2

3

4

5

6

7

8

9

10

11

12

$.post(

    "submit.aspx",{

        id:     '123',

        name:   '青藤園',

    },function(data,state){

        //這裏顯示從服務器返回的數據

        alert(data);

        //這裏顯示返回的狀態

        alert(state);

    },

    "json"

)

三、$.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。

四、$.ajax()

$.ajax()是jquery中通用的一個ajax封裝,其語法的格式爲:

$.ajax(options)

其中options是一個object類型,它指明瞭本次ajax調用的具體參數,這裏我把最經常使用的幾個參數附上

1

2

3

4

5

6

7

8

9

10

11

12

13

14

$.ajax({

        url: 'submit.aspx',

        datatype: "json",

        type: 'post',

        success: function (e) {   //成功後回調

            alert(e);

        },

        error: function(e){    //失敗後回調

            alert(e);

        },

        beforeSend: function(){  /發送請求前調用,能夠放一些"正在加載"之類額話

            alert("正在加載");

        }

})

相關文章
相關標籤/搜索