jQuery ajax - getJSON() method

jQuery Ajax 参考手册

Halimbawa

Gumamit ng AJAX request upang kumuha ng JSON data at ipalabas ang resulta:

$("button").click(function(){
  $.getJSON("demo_ajax_json.js",function(result){
    $.each(result, function(i, field){
      $("div").append(field + " ");
    );
  );
);

Subukan ang iyong sarili

Pagsasaayos at paggamit

Ipagkarga ang JSON data sa pamamagitan ng HTTP GET request.

Sa jQuery 1.2, maari kang gumamit ng callback function sa JSONP form sa pagkakarga ng JSON data mula sa ibang domain, tulad ng "myurl?callback=?". Ang jQuery ay awtomatikong papalitan ang ? ng tamang pangalan ng function upang maisagawa ang callback function. Babala: Ang mga sulat na ito ay magsisimula bago maisagawa ang callback function.

Gramata

jQuery.getJSON(url,data,success(data,status,xhr))
Parametro Paglalarawan
url Hindi puwedeng iwanan. Batas ang anong URL ang ipapadala ng request.
data Pupuntahan. Ang batas na pangungusap sa data na ipapadala sa server.
success(data,status,xhr)

可選。規定當請求成功時運行的函數。

額外的參數：

  • response - 包含來自請求的結果數據
  • status - 包含請求的狀態
  • xhr - 包含 XMLHttpRequest 對象

詳細說明

此函數是簡寫的 Ajax 函數，等價於：

$.ajax({
  url: url,
  data: data,
  success: callback,
  dataType: json
);

發送到服務器的數據可作為查詢字串附加到 URL 之後。如果 data 參數的值是對象（映射），那麼在附加到 URL 之前將轉換為字串，並進行 URL 编碼。

傳遞給 callback 的返回數據，可以是 JavaScript 對象，或以 JSON 結構定義的數組，並使用 $.parseJSON() 方法進行解析。

示例

從 test.js 載入 JSON 數據並顯示 JSON 數據中一個 name 字段數據：

$.getJSON("test.js", function(json){
  alert("JSON Data: " + json.users[3].name);
);

更多示例

例子 1

從 Flickr JSONP API 載入 4 張最新的關於貓的圖片：

HTML 代碼：

<div id="images"></div>

jQuery 代碼：


$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?
tags=cat&tagmode=any&format=json&jsoncallback=?", function(data){
  $.each(data.items, function(i,item){
    $("<img/>").attr("src", item.media.m).appendTo("#images");
    if ( i == 3 ) return false;
  );
);

例子 2

從 test.js 載入 JSON 數據，附加參數，顯示 JSON 數據中一個 name 字段數據：

$.getJSON("test.js", { name: "Bill", time: "2pm" }, function(json){
  alert("JSON Data: " + json.users[3].name);
);

jQuery Ajax 参考手册