Versuchen, JSON-Antwort in einer Tabelle zu setzen - undefined Fehler

Question

Ich habe eine JSON Antwort von einer API, die ich versuche, in eine Tabelle zu legen. Das ist, was ich habe:

http://jsfiddle.net/xnj1hwwj/2/

$(document).ready(function() { 
    var json = "http://api.geonames.org/findNearbyPlaceNameJSON?lat=51.4500&lng=-2.5833&username=demo&maxRows=2&radius=5"; 
    var tr; 
    for (var i = 0; i < json.length; i++) { 
    tr = $('<tr/>'); 
    tr.append("<td>" + json[i].name + "</td>"); 
    tr.append("<td>" + json[i].distance + "</td>"); 
    $('table').append(tr); 
    } 
}); 

Jedes Feedback zu schätzen würde, wie ich dieses Laufen zu bekommen. Ich würde lieber keine andere Bibliothek dafür verwenden, wenn ich es vermeiden kann.

Answer 1

Ihr Code shoud wie folgt aussehen, wenn Sie Ihre json wollen einige Daten haben:

var url = "http://api.geonames.org/findNearbyPlaceNameJSON?lat=51.4500&lng=-2.5833&username=demo&maxRows=2&radius=5"; 
var xhr = new XMLHttpRequest(); 

xhr.onreadystatechange = function (e) { 
    if (this.readyState === 4 && this.status == 200) { 

     //turn the response into a json object 
     data = JSON.parse(xhr.responseText); 
     // do whatever you want now 


    } 
} 
xhr.open('GET', url, true); 
xhr.send(); 

Sie werden nicht in der Lage sein, um es wegen https://developer.mozilla.org/en-US/docs/Security/Mixed_content

Answer 2

Wie von @Moishe Lipsker in den Kommentaren angegeben, haben Sie keine AJAX-Anfrage, nur eine URL mit einer Reihe von GET-Parametern. Sie sollten eine der jQuery AJAX-Methoden lesen, z. B. $.ajax(), die erforderlich ist, um das JSON-Objekt zurückzugeben, das Sie benötigen.

http://api.jquery.com/jquery.ajax/

Answer 3

in einer Geige funktioniert

Führen Sie zuerst einen Ajax-Anruf aus, um eine Antwort zu erhalten:

$.get('http://api.geonames.org/findNearbyPlaceNameJSON?lat=51.4500&lng=-2.5833&username=demo&maxRows=2&radius=5', function(json) { 
 
    renderResponse(json, $('#result'), 0); 
 
}); 
 
function renderResponse(obj, node, space) { 
 
    var keys = Object.keys(obj); 
 
    for(var i = 0; i < keys.length; i ++) { 
 
     var inside = obj[keys[i]] 
 
     , isWritable = ['string', 'number', 'boolean'].indexOf(typeof inside) != -1 
 
     , key = keys[i] 
 
     , indentation = Array(space + 1).join('&nbsp;') 
 
     ; 
 
     var prop = $('<div/>', {html: indentation + key + ':&nbsp' + (isWritable ? inside : '[') + '<br>'}).appendTo(node); 
 
     if(!isWritable) { 
 
      renderResponse(inside, prop, space + 8); 
 
      $('<div/>', {html: indentation + ']' + (i < keys.length - 1 ? ',' : '') + '<br>'}).appendTo(prop); 
 
     } 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<div id="result"></div>