htmlのフォームで郵便番号を入力すると、都道府県・市区町村など
住所を自動で表示してくれる便利なAPI「Ajaxzip3」。
以下、使用方法のメモ。
ajaxzip3の使い方
◆headタグに以下を入れる。
<script type="text/JavaScript" src="http://ajaxzip3.googlecode.com/svn/trunk/ajaxzip3/ajaxzip3.js" charset="UTF-8"></script>
※SSLの場合はこっち↓
<script type="text/JavaScript" src="https://ajaxzip3.googlecode.com/svn/trunk/ajaxzip3/ajaxzip3-https.js" charset="UTF-8"></script>
◆郵便番号のinputタグにonKeyUp属性を入れる。
onKeyUp="AjaxZip3.zip2addr(this,'','都道府県','市区町村');
◆自動表示させるinputタグのname属性に都道府県、市区町村を指定する。
ajaxzip3使用のhtml(例)
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Ajaxzip3テスト</title>
<script type="text/JavaScript" src="http://ajaxzip3.googlecode.com/svn/trunk/ajaxzip3/ajaxzip3.js" charset="UTF-8"></script>
</head>
<body>
<table border="1">
<tr>
<th colspan="2">都道府県と市区町村を別々で表示する場合</th>
</tr>
<tr>
<td style="width:120px">郵便番号</td>
<td style="width:280px"><input type="text" class="text" name="object_post_number" value="" onkeyup="AjaxZip3.zip2addr(this,'','prefecture','city');" /></td>
</tr>
<tr>
<td>都道府県</td>
<td><input type="text" class="text" name="prefecture" value="" style="width:90%" /></td>
</tr>
<tr>
<td>市区町村</td>
<td><input type="text" class="text" name="city" value="" style="width:90%" /></td>
</tr>
</table>
<br />
<table border="1">
<tr>
<th colspan="2">都道府県と市区町村を一緒に表示する場合</th>
</tr>
<tr>
<td style="width:120px">郵便番号</td>
<td style="width:280px"><input type="text" name="delivery_post_number" value="" onkeyup="AjaxZip3.zip2addr(this,'','prefecture_city','prefecture_city');" /></td>
</tr>
<tr>
<td>都道府県市区町村</td>
<td><input type="text" name="prefecture_city" value="" style="width:90%" /></td>
</tr>
</table>
</body>
</html>