Je traite une réponse JSON dans l'une de mes applications. J'ai établi une connexion avec jsonp avec succès. Mais je ne suis pas capable d'analyser ma réponse.
Code:
<script type='text/javascript'>
(function($) {
var url = 'http://cooktv.sndimg.com/webcook/sandbox/perf/topics.json';
$.ajax({
type: 'GET',
url: url,
async: false,
jsonpCallback: 'callback',
contentType: "application/json",
dataType: 'jsonp',
success: function(json) {
console.log(json.topics);
$("#nav").html('<a href="">'+json.topics+"</a>");
},
error: function(e) {
console.log(e.message);
}
});
})(jQuery);
</script>
Sortie je reçois:
[object Object],[object Object],[object Object]
Exemple de réponse:
callback({"topics":[{"name":"topic","content":[{"link_text":"link","link_src":"http://www.foodnetwork.com/"},{"link_text":"link","link_src":"http://www.hgtv.com/"},{"link_text":"link","link_src":"http://www.diynetwork.com/"},{"link_text":"link","link_src":"http://www.cookingchanel.com/"},{"link_text":"link","link_src":"http://www.travelchannel.com/"},{"link_text":"link","link_src":"http://www.food.com/"}]},{"name":"topic2","content":[{"link_text":"link","link_src":"http://www.google.com/"},{"link_text":"link","link_src":"http://www.yahoo.com/"},{"link_text":"link","link_src":"http://www.aol.com/"},{"link_text":"link","link_src":"http://www.msn.com/"},{"link_text":"link","link_src":"http://www.facebook.com/"},{"link_text":"link","link_src":"http://www.Twitter.com/"}]},{"name":"topic3","content":[{"link_text":"link","link_src":"http://www.a.com/"},{"link_text":"link","link_src":"http://www.b.com/"},{"link_text":"link","link_src":"http://www.c.com/"},{"link_text":"link","link_src":"http://www.d.com/"},{"link_text":"link","link_src":"http://www.e.com/"},{"link_text":"link","link_src":"http://www.f.com/"}]}]});
Je veux sous la forme de:
Sujet: Lien
Essayez ceci:
success: function(json) {
console.log(JSON.stringify(json.topics));
$.each(json.topics, function(idx, topic){
$("#nav").html('<a href="' + topic.link_src + '">' + topic.link_text + "</a>");
});
},
Je traînais sur Google, puis j'ai trouvé votre question et il est très simple d'analyser la réponse JSON en HTML normal. Il suffit d'utiliser ce petit code JavaScript:
<!DOCTYPE html>
<html>
<body>
<h2>Create Object from JSON String</h2>
<p id="demo"></p>
<script>
var obj = JSON.parse('{ "name":"John", "age":30, "city":"New York"}');
document.getElementById("demo").innerHTML = obj.name + ", " + obj.age;
</script>
</body>
</html>
La question initiale consistait à analyser une liste de sujets. Toutefois, commencer par l'exemple original pour qu'une fonction renvoie une valeur unique peut également être utile. À cette fin, voici un exemple de (une façon) de le faire:
<script type='text/javascript'>
function getSingleValueUsingJQuery() {
var value = "";
var url = "rest/endpointName/" + document.getElementById('someJSPFieldName').value;
jQuery.ajax({
type: 'GET',
url: url,
async: false,
contentType: "application/json",
dataType: 'json',
success: function(json) {
console.log(json.value); // needs to match the payload (i.e. json must have {value: "foo"}
value = json.value;
},
error: function(e) {
console.log("jQuery error message = "+e.message);
}
});
return value;
}
</script>
Les données renvoyées par le JSON sont au format JSON: il s’agit simplement d’un tableau de valeurs. C'est pourquoi vous voyez [objet Object], [objet Object], [objet Object] .
Vous devez parcourir ces valeurs pour obtenir une valeur réelle. Comme le suivant
jQuery fournit $ .each () pour les itérations, vous pouvez donc aussi faire ceci:
$.getJSON("url_with_json_here", function(data){
$.each(data, function (linktext, link) {
console.log(linktext);
console.log(link);
});
});
Maintenant, créez simplement un lien hypertexte utilisant ces informations.
Essayez le code ci-dessous. Ceci aide votre code.
$("#btnUpdate").on("click", function () {
//alert("Alert Test");
var url = 'http://cooktv.sndimg.com/webcook/sandbox/perf/topics.json';
$.ajax({
type: "GET",
url: url,
data: "{}",
dataType: "json",
contentType: "application/json; charset=utf-8",
success: function (result) {
debugger;
$.each(result.callback, function (index, value) {
alert(index + ': ' + value.Name);
});
},
failure: function (result) { alert('Fail'); }
});
});
Je ne pouvais pas accéder à votre URL. Erreur ci-dessous est montre
XMLHttpRequest ne peut pas charger http://cooktv.sndimg.com/webcook/sandbox/perf/topics.json . La réponse à la demande de contrôle en amont ne réussit pas la vérification du contrôle d'accès: aucun en-tête 'Access-Control-Allow-Origin' n'est présent sur la ressource demandée. L'origine ' http: // localhost: 19829 ' n'est donc pas autorisée. La réponse avait le code d'état HTTP 501.
jQuery.ajax({
type: 'GET',
url: "../struktur2/load.php",
async: false,
contentType: "application/json",
dataType: 'json',
success: function(json) {
items = json;
},
error: function(e) {
console.log("jQuery error message = "+e.message);
}
});