Parsen der JSON-Antwort mit Hilfe von jQuery

Ich bin den Umgang mit einer JSON-Antwort in einer meiner Anwendungen. Ich habe eine Verbindung mit jsonp erfolgreich. Aber ich bin nicht in der Lage zu analysieren, meine Antwort.

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>

Ausgabe, die ich bekommen hab:

[object Object],[object Object],[object Object]

Antwort Beispiel:

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/"}]}]});

Möchte ich in form von :

Thema: Link

InformationsquelleAutor Radhakrishna Rayidi | 2013-06-28

21

Geben diesem einen Versuch:
```
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>");
   });
},
```
Arbeitete wie ein Charme 🙂
es funktioniert Super, danke
Ich bin immer eine Antwort wie diese [{id: 1, message: "sdfsdf", message_for: 1, message_by: 2, created_at: "2015-08-29 08:22:02",…},…] gibt Es keine variable, wie Themen wie in der Frage.

InformationsquelleAutor Aguardientico

Hing ich auf Google, dann fand ich Ihre Frage, und es ist sehr einfach zu Parsen von JSON-Antwort in normalem HTML. Verwenden Sie einfach diese kleinen JavaScript-code:

<!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>

InformationsquelleAutor Justin Imran

0

Die Daten zurückgegeben, die durch den JSON in json-format : das ist einfach eine Reihe von Werten. Das ist, warum Sie sehen [object object],[object object],[object object].

Haben Sie zu Durchlaufen, die Werte zu bekommen, aktuellen Wert. Wie die folgenden

jQuery bietet $.each() für Iterationen, so könnte man dies auch tun:
```
$.getJSON("url_with_json_here", function(data){
    $.each(data, function (linktext, link) {
        console.log(linktext);
        console.log(link);
    });
});
```
Nun erstellen Sie einfach einen Hyperlink verwenden, die info.

Hat nicht geklappt... 🙁

InformationsquelleAutor

Ursprünglichen Frage war es, zu analysieren, eine Liste von Themen, jedoch beginnend mit dem ursprünglichen Beispiel eine Funktion einen einzelnen Wert zurückgeben, kann auch nützlich. Zu diesem Zweck, hier ist ein Beispiel (ein Weg) zu tun:

<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>

InformationsquelleAutor Paul-59701

Versuchen Balg-code. Dies wird helfen, Ihren 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'); }
            });
        });

Ich konnte nicht auf Ihre url. Balg Fehler zeigt

XMLHttpRequest-Objekt kann nicht geladen werden http://cooktv.sndimg.com/webcook/sandbox/perf/topics.json. Antwort auf preflight-Anfrage nicht passieren access control check: Kein "Access-Control-Allow-Origin' - header vorhanden ist, auf die angeforderte Ressource. Herkunft 'http://localhost:19829' ist daher nicht der Zugriff erlaubt. Die Antwort hatte HTTP status code-501.

InformationsquelleAutor muthukumar

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

Eine Erklärung wäre hilfreich.

InformationsquelleAutor mobuhai

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.