郵便番号から住所補完zip2addrサンプル

• Google日本語入力APIを利用し、完全にメンテナンスフリーな住所補完機能を提供します。
• フロントエンドのJavaScriptのみで作動するため、サーバーサイドに手を加える必要はありません。
• 数行のJavaScriptを書くだけで簡単に既存のフォームに実装できます。
• こちらからどうぞー: https://github.com/kotarok/jQuery.zip2addr

jQueryとzip2addrの読み込み

下記のようにjQueryとzip2addrを読み込んでおきます。これで準備は完了。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="jquery.zip2addr.js"></script>

シンプルなケース

郵便番号

住所

$('#order_zip').zip2addr('#order_addr')

都道府県が別フィールドの場合

郵便番号

住所

$('#zip2').zip2addr({
	pref:'#pref2',
	addr:'#addr2'
})

都道府県がselect要素の場合

郵便番号

住所

北海道 青森県 岩手県 宮城県 秋田県 山形県 福島県 茨城県 栃木県 群馬県 埼玉県 千葉県 東京都 神奈川県 新潟県 富山県 石川県 福井県 山梨県 長野県 岐阜県 静岡県 愛知県 三重県 滋賀県 京都府 大阪府 兵庫県 奈良県 和歌山県 鳥取県 島根県 岡山県 広島県 山口県 徳島県 香川県 愛媛県 高知県 福岡県 佐賀県 長崎県 熊本県 大分県 宮崎県 鹿児島県 沖縄県

$('#zip3').zip2addr({
	pref:'#pref3',
	addr:'#addr3'
})

郵便番号フィールドが別れている場合

郵便番号

-

住所

$('#zip4-1').zip2addr({
	zip2:'#zip4-2',
	addr:'#addr4'
})

郵便番号フィールドも住所フィールドも別れている場合

郵便番号

-

住所

$('#zip5-1').zip2addr({
	zip2:'#zip5-2',
	pref:'#pref5',
	addr:'#addr5'
})