Beispiel für die Verwendung von getJSON() in jQuery+Ajax

Beispiel
Laden Sie JSON-Daten aus test.js und zeigen Sie Namensfelddaten in den JSON-Daten an:

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

Definition und Verwendung
Laden Sie JSON-Daten über eine HTTP-GET-Anfrage.

In jQuery 1.2 können Sie JSON-Daten aus anderen Domänen laden, indem Sie eine Rückruffunktion im JSONP-Stil verwenden, z. B. „myurl?callback=?“. jQuery ersetzt ? automatisch durch den richtigen Funktionsnamen, um die Rückruffunktion auszuführen. Hinweis: Der Code nach dieser Zeile wird ausgeführt, bevor diese Rückruffunktion ausgeführt wird.

Syntax
jQuery.getJSON(url,[data],[callback])

Parameterbeschreibung
url Die URL-Adresse der Seite, die geladen werden soll.
Daten Schlüssel-/Wertparameter, die gesendet werden sollen.
Rückruf Die Rückruffunktion wird ausgeführt, wenn der Ladevorgang erfolgreich war.

Detaillierte Beschreibung

Diese Funktion ist eine abgekürzte Ajax-Funktion, äquivalent zu:

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

Die an den Server gesendeten Daten können als Abfragezeichenfolge an die URL angehängt werden . Wenn der Wert des Datenparameters ein Objekt (Karte) ist, wird er in eine Zeichenfolge konvertiert und URL-codiert, bevor er an die URL angehängt wird.

Die an den Rückruf übergebenen Rückgabedaten können ein JavaScript-Objekt oder ein in einer JSON-Struktur definiertes Array sein und werden mit der Methode $.parseJSON() analysiert.

Weitere Beispiele

Beispiel 1
Laden Sie die 4 neuesten Katzenbilder von Flickr JSONP API:

HTML-Code:

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

jQuery-Code:

$.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;
  });
});

Beispiel 2
JSON-Daten aus test.js laden, Parameter anhängen und Namensfelddaten in den JSON-Daten anzeigen:

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

Weitere Informationen Artikel zu getJSON()-Verwendungsbeispielen in jQuery+Ajax, bitte beachten Sie die chinesische PHP-Website!