Description: Load JSON-encoded data from the server using a GET HTTP request.
urlA string containing the URL to which the request is sent.
dataA map or string that is sent to the server with the request.
callback(data, textStatus)A callback function that is executed if the request succeeds.
This is a shorthand Ajax function, which is equivalent to:
$.ajax({ url: url, dataType: 'json', data: data, success: success });
The callback is passed the returned data, which will be a JavaScript object or array as defined by the JSON structure and parsed using the $.parseJSON()
method.
Note: For details on the JSON format, see http://json.org/.
Most implementations will specify a success handler:
$.getJSON('ajax/test.json', function(data) { $('.result').html('<p>' + data.foo + '</p>' + '<p>' + data.baz[1] + '</p>'); });
This example, of course, relies on the structure of the JSON file:
{ "foo": "The quick brown fox jumps over the lazy dog.", "bar": "ABCDEFG", "baz": [52, 97] }
Using this structure, the example inserts the first string and second number from the file onto the page.
If there is a syntax error in the JSON file, the request will usually fail silently. Avoid frequent hand-editing of JSON data for this reason.
If the specified URL is on a remote server, the request is treated as JSONP instead. See the discussion of the jsonp
data type in $.ajax()
for more details.
<!DOCTYPE html>
<html>
<head>
<style>img{ height: 100px; float: left; }</style>
<script src="https://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<div id="images">
</div>
<script>$.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;
});
});</script>
</body>
</html>
$.getJSON("test.js", function(json){
alert("JSON Data: " + json.users[3].name);
});
$.getJSON("test.js", { name: "John", time: "2pm" }, function(json){
alert("JSON Data: " + json.users[3].name);
});
var id=$("#id").attr("value");
$.getJSON("pages.php",{id:id},dates);
function dates(datos) {
$("#list").html("Name:"+datos[1].name+"<br>"+"Last Name:"+datos[1].lastname+"<br>"+"Address:"+datos[1].address);
}