Run
<!DOCTYPE html> <html lang="en"> <head> <title>Live Demo: jQuery Get JSON Data from URL</title> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script> $(document).ready(function () { $('.mysubmit').on('click', function (e) { myURL = "myjson.json"; $.getJSON(myURL, function(data){ $('#data').append(data[0].Name) //Result: John; $('#data').append("<br>"); $('#data').append(data[0].Email) //Result: john@gmail.com; $('#data').append("<br>"); //Get second level JSON data Address $('#data').append(data[0].Address[0].Country) //Result: US; }).fail(function() { alert( "Error in getting result." ); }); return false; }); }); </script> <style> body{ padding: 15px; } </style> </head> <body> <button name="submit" type="submit" value="Submit" class="mysubmit">jQuery Get JSON Data</button> <div id="data"></div> </body> </html>
Go to
Tutorialdeep Homepage