jQuery ajax - getJSON() 方法

实例

使用 AJAX 请求来获得 JSON 数据,并输出结果:

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

亲自试一试

定义和用法

通过 HTTP GET 请求载入 JSON 数据。

在 jQuery 1.2 中,您可以通过使用 JSONP 形式的回调函数来加载其他网域的 JSON 数据,如 "myurl?callback=?"。jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。注意:此行以后的代码将在这个回调函数执行前执行。

语法

jQuery.getJSON(url,data,success(data,status,xhr)})
参数 描述
url 必需。规定将请求发送的哪个 URL。
data 可选。规定连同请求发送到服务器的数据。
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().

Παράδειγμα

Φορτώστε JSON δεδομένα από το test.js και εμφανίστε δεδομένα του πεδίου name στο JSON δεδομένα:

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

Περισσότερα παραδείγματα

Παράδειγμα 1

Φορτώστε 4 από τα πιο πρόσφατα εικόνες για γάτες από το JSONP API του Flickr:

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

Φορτώστε JSON δεδομένα από το test.js, προσθέστε παραμέτρους, και εμφανίστε δεδομένα του πεδίου name στο JSON δεδομένα:

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