Maison > Article > interface Web > Exemple d'utilisation de getJSON() dans jQuery ajax
Exemple
Chargez les données JSON à partir de test.js et affichez les données d'un champ de nom dans les données JSON :
$.getJSON("test.js", function(json){ alert("JSON Data: " + json.users[3].name); });
Définition et utilisation
Chargez les données JSON via une requête HTTP GET.
Dans jQuery 1.2, vous pouvez charger des données JSON à partir d'autres domaines en utilisant une fonction de rappel de style JSONP, telle que "myurl?callback=?". jQuery remplacera automatiquement ? par le nom de fonction correct pour exécuter la fonction de rappel. Remarque : Le code après cette ligne sera exécuté avant l'exécution de cette fonction de rappel.
Syntaxe
jQuery.getJSON(url,[data],[callback])
Description du paramètre
url L'adresse URL de la page à charger.
données Paramètres clé/valeur à envoyer.
callback La fonction de rappel exécutée lorsque le chargement est réussi.
Description détaillée
Cette fonction est une fonction Ajax abrégée, équivalente à :
$.ajax({ url: url, data: data, success: callback, dataType: json });
Les données envoyées au serveur peuvent être ajoutées à l'URL sous forme de chaîne de requête . Si la valeur du paramètre data est un objet (carte), elle est convertie en chaîne et codée en URL avant d'être ajoutée à l'URL.
Les données de retour transmises au rappel peuvent être un objet JavaScript ou un tableau défini dans une structure JSON, et sont analysées à l'aide de la méthode $.parseJSON().
Plus d'exemples
Exemple 1
Charger les 4 dernières photos de chats depuis 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
Chargez les données JSON à partir de test.js, ajoutez des paramètres et affichez les données d'un champ de nom dans les données JSON :
$.getJSON("test.js", { name: "John", time: "2pm" }, function(json){ alert("JSON Data: " + json.users[3].name); });
Pour en savoir plus articles liés aux exemples d'utilisation de getJSON() dans jQuery ajax, veuillez faire attention au site Web PHP chinois !