AjaxZip3というJSライブラリを使って郵便番号から住所を取得してみようと思います。
こちらのライブラリはyubinbangoと同じ作者の方が作っているようです。
Githubではyubinbangoの方が新しくて推奨されていました。
郵便番号を入れると住所を取得するJSライブラリ、yubinbangoを使ってみる - しめ鯖日記
使い方
使い方は下のとおりにajaxzip3のタグを追加するだけです。
必須ではないのですがjqueryも一緒にインストールします。
<script src="https://ajaxzip3.github.io/ajaxzip3.js" charset="UTF-8"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" charset="UTF-8"></script>
下のようにinputタグを配置します。
<input type="text" name="zip" size="10" maxlength="8"> <input type="text" name="addr1" size="20"> <input type="text" name="addr2" size="60"> <input type="text" name="addr3" size="60"> <input type="button" id="button" value="load" />
buttonタグを押下時にAjaxZip3.zip2addrを呼ぶようにします。
引数には各inputタグのnameプロパティーの値を入れます。
<script type="text/javascript"> $("#button").click(function() { AjaxZip3.zip2addr('zip', '', 'addr1', 'addr2', 'addr3'); }); </script>
この状態で郵便番号を入力し、ボタンを押下すると下のように補完されます。
引数にはnameプロパティーの値を入れずに要素を直接入れても動くようです。
