<jQuery> getJSON

Javascript jQuery

jQuery javascriptでjsonデータを引っ張るには、、、
$.getJSONだ。 だー、だー、だー、、、。

郵便番号zipcodeを引っ張るスクリプトscript。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <title>Zipcode</title>
</head>

<body>
    <form>
      <div>
        <label for="zip">Zipcode</label><br />
        <input id="zip" type="text" size="10" />
        <input id="search" type="button" value="Search" />
      </div>
      <div>
        <label for="address">Address</label><br />
        <input id="address" type="text" size="35" />
      </div>
    </form>
</body>

<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>

<script>
$(function() {
  $('#search').click(function() {
    $.getJSON('http://zipcloud.ibsnet.co.jp/api/search?callback=?',
      {
        zipcode: $('#zip').val()
      }
    )
    .done(function(data) {
      if (data.results) {
        var result = data.results[0];
        $('#address').val(result.address1 + result.address2 + result.address3);
      } else {
        $('#address').val('No address matched');
      }
    });
  });
});
</script>

</html>

zipcloud.ibsnet.co.jp

jQuery： JSON形式のWeb APIにアクセスするには？（$.getJSON） - Build Insider