Méthode getJSON() de jQuery ajax

Manuel de référence Ajax jQuery

Exemple

Obtenez des données JSON via une requête AJAX et affichez les résultats :

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

Essayer personnellement

Définition et utilisation

Charge des données JSON via une requête HTTP GET.

Dans jQuery 1.2, vous pouvez charger des données JSON provenant d'autres domaines en utilisant des fonctions de rappel JSONP, comme "myurl?callback=?". jQuery remplacera automatiquement ? par le nom de la fonction correcte pour exécuter la fonction de rappel. Note : Les lignes de code suivantes seront exécutées avant l'exécution de la fonction de rappel.

Syntaxe

jQuery.getJSON(url,data,success(data,status,xhr)})
Paramètres Description
url Obligatoire. Définit quel URL sera utilisé pour envoyer la requête.
data Optionnel. Définit les données envoyées au serveur avec la requête.
success(data,status,xhr)}

Optionnel. Définit la fonction à exécuter lorsque la requête est réussie.

Paramètres supplémentaires :

  • response - Contient les données du résultat de la requête
  • status - Contient l'état de la requête
  • xhr - Contient l'objet XMLHttpRequest

Description détaillée

Cette fonction est une version abrégée de la fonction Ajax, équivalente à :

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

Les données à envoyer au serveur peuvent être ajoutées à l'URL après un chaîne de requête. Si data Si la valeur du paramètre est un objet (mappage), il est converti en chaîne et codé en URL avant d'être ajouté à l'URL.

Passé à callback Les données de retour peuvent être des objets JavaScript ou des tableaux définis avec une structure JSON, et peuvent être analysés avec la méthode $.parseJSON().

Exemple

Charger des données JSON depuis test.js et afficher une donnée du champ name dans les données JSON :

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

Plus d'exemples

Exemple 1

Charger 4 des dernières images de chats via l'API JSONP de Flickr :

Code HTML :

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

Code 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;
  });
});

Exemple 2

Charger des données JSON depuis test.js, ajouter des paramètres, afficher une donnée du champ name dans les données JSON :

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

Manuel de référence Ajax jQuery