[jQuery] getJSON: use retrieved data outside the function???
Hi
In the code below the second alert is executed before the first one
making it show the "empty" content, and not the result from the .json
file. Why, and how can I make it work???
-------------------------------------------------
getjson.html file
-------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>getJson</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-
latest.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var content = 'empty';
$.getJSON("getjson.json",
function(json){
content = json.layout.template[1].content;
alert(content);//This work
});
alert(content); //This don't
});
</script>
</head>
<body></body>
</html>
-------------------------------------------------
getjson.json file
-------------------------------------------------
{
"layout":
{
"template":
[
{
"key": "01",
"content": "<span id=\"span1\">010101</span>"
},
{
"key": "02",
"content": "<span id=\"span2\">020202</span>"
},
{
"key": "03",
"content": "<span id=\"span3\">030303</span>"
}
]
}
}