AjaxでJSONを呼ぶ

  • HTML
<html>
<head><title>Ajax Test</title>
<script type="text/JavaScript" src="prototype.js"></script>
<script type="text/JavaScript">
<!--
function load() {
  var url = 'json.txt';
  var prm = '';
  var ajax = new Ajax.Request(
    url, 
    {
      method: 'get', 
      parameters: prm, 
      onComplete: complete
    });
}
function complete(req) {
  try {
    eval("var data = " + req.responseText);
    $('target').innerHTML = "name:" + data.name + "<br>address:" + data.address;
  } catch(e) { alert(e); }
}
//-->
</script>
</head>
<body>
  <input type="button" value="OK" onclick="load()" />
  <p>
  <div id="target"></div>
</body>
</html> 
{
  name: "Mino",
  address: "Japan"	
}

json.txtをCGIなどにする場合は、Content-Typeをtext/javascriptなどにする。