ajaxzip3 APIを使うと、入力した郵便番号から住所を得ることができる。
使い方は以下のとおり。
ajaxzip3 APIの組み込み
<script src="https://ajaxzip3.github.io/ajaxzip3.js" charset="UTF-8"></script>検索フォーマット
<div class="wrapper"> <div class="content"> <label>郵便番号</label> <span class="content_form"> <input id="zip" name="zip" type="text"> </span> <span class="content_form"> <input class="studentEnrollment_button" type="button" value="住所を自動で入力する"> </span> </div> <div class="content"> <label>都道府県</label> <span class="content_form"> <input id="state" name="state" type="text"> </span> </div> <div class="content"> <label>市区町村</label> <span class="content_form"> <input id="city" name="city" type="text"> </span> </div> <div class="content"> <label>番地</label> <span class="content_form"> <input id="address1" name="address1" type="text"> </span> </div> </div>【javascript】
jQuery(function($){ $('input[type="button"]').click(function(){ // 郵便番号から住所を取得 var zip = $('#zip').val(); // zipのバリデーション if( ! check_zipcode( zip ) ) { alert('郵便番号が正しくありません'); return false; } AjaxZip3.zip2addr('zip','','state','city','address1'); }); }); function check_zipcode( zipcode ) { if( ! zipcode ){ return false; } if( 0 == zipcode.length ){ return false; } if( ! zipcode.match( /^[0-9]{3}[-]?[0-9]{0,4}$/ ) ) { return false; } return true; }
サンプル