Maison  >  Article  >  interface Web  >  Exemple d'utilisation de getJSON() dans jQuery ajax

Exemple d'utilisation de getJSON() dans jQuery ajax

高洛峰
高洛峰original
2017-01-12 10:04:091085parcourir

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 !

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn