AjaxZip3の使い方 AjaxZip3

AjaxZip3の使用方法をご紹介しています。
AjaxZip2の後継で、prototype.jsやjQuery、郵便番号データが不要になり使いやすくなった郵便番号から住所を自動入力が可能なJavaScriptライブラリです。

公式サイト

※ Google Code閉鎖、GitHubへの移行に従い、公式サイトへのリンク及びJavaScriptファイルのパスを変更いたしました。

デモ
JavaScriptの読み込み
HTML設定

デモ

郵便番号のエリアを2つにした場合のデモです。

読み込み

以下のタグを<head>内に記述します。

HTML

HTML設定

郵便番号のinput要素にonKeyUpを記述します。
基本的な設定は、onKeyUp="AjaxZip3.zip2addr(郵便番号（全てまたは上3桁）,郵便番号（下4桁）,都道府県,市区町村,丁目番地,町域大字);となり、それぞれname属性を記述します。
（都道府県がプルダウンメニュー場合でも可能です。）

郵便番号・住所が1エリアの場合（ハイフンの有無どちらも機能します。）

HTML

郵便番号
住所

郵便番号が2エリア、住所が1エリアの場合

郵便番号が2エリア、住所が2エリアの場合

郵便番号が2エリア、住所が2エリアの場合（プルダウンメニュー）
※ 都道府県のプルダウンは都道府県名または都道府県番号（都道府県コード）対応しています。

<form action="./" method="post">
								〒 <input type="text" name="zip1"> - <input type="text" name="zip2" onKeyUp="AjaxZip3.zip2addr('zip1','zip2','address1','address2');">
								都道府県
									<select name="address1">
										<option value="">-- 選択してください --</option>
										<option value="北海道">北海道</option>
										<option value="青森県">青森県</option>
										<option value="岩手県">岩手県</option>
										<option value="宮城県">宮城県</option>
										<option value="秋田県">秋田県</option>
										<option value="山形県">山形県</option>
										<option value="福島県">福島県</option>
										<option value="茨城県">茨城県</option>
										<option value="栃木県">栃木県</option>
										<option value="群馬県">群馬県</option>
										<option value="埼玉県">埼玉県</option>
										<option value="千葉県">千葉県</option>
										<option value="東京都">東京都</option>
										<option value="神奈川県">神奈川県</option>
										<option value="新潟県">新潟県</option>
										<option value="富山県">富山県</option>
										<option value="石川県">石川県</option>
										<option value="福井県">福井県</option>
										<option value="山梨県">山梨県</option>
										<option value="長野県">長野県</option>
										<option value="岐阜県">岐阜県</option>
										<option value="静岡県">静岡県</option>
										<option value="愛知県">愛知県</option>
										<option value="三重県">三重県</option>
										<option value="滋賀県">滋賀県</option>
										<option value="京都府">京都府</option>
										<option value="大阪府">大阪府</option>
										<option value="兵庫県">兵庫県</option>
										<option value="奈良県">奈良県</option>
										<option value="和歌山県">和歌山県</option>
										<option value="鳥取県">鳥取県</option>
										<option value="島根県">島根県</option>
										<option value="岡山県">岡山県</option>
										<option value="広島県">広島県</option>
										<option value="山口県">山口県</option>
										<option value="徳島県">徳島県</option>
										<option value="香川県">香川県</option>
										<option value="愛媛県">愛媛県</option>
										<option value="高知県">高知県</option>
										<option value="福岡県">福岡県</option>
										<option value="佐賀県">佐賀県</option>
										<option value="長崎県">長崎県</option>
										<option value="熊本県">熊本県</option>
										<option value="大分県">大分県</option>
										<option value="宮崎県">宮崎県</option>
										<option value="鹿児島県">鹿児島県</option>
										<option value="沖縄県">沖縄県</option>
									</select>
								市区町村番地など <input type="text" name="address2" size="60">
							</form>

郵便番号	-
都道府県
市区町村番地など

都道府県のプルダウンが都道府県番号（都道府県コード）の場合：

<form action="./" method="post">
								〒 <input type="text" name="zip1"> - <input type="text" name="zip2" onKeyUp="AjaxZip3.zip2addr('zip1','zip2','address1','address2');">
								都道府県
									<select name="address1">
										<option value="">-- 選択してください --</option>
										<option value="01">北海道</option>
										<option value="02">青森県</option>
										<option value="03">岩手県</option>
										<option value="04">宮城県</option>
										<option value="05">秋田県</option>
										<option value="06">山形県</option>
										<option value="07">福島県</option>
										<option value="08">茨城県</option>
										<option value="09">栃木県</option>
										<option value="10">群馬県</option>
										<option value="11">埼玉県</option>
										<option value="12">千葉県</option>
										<option value="13">東京都</option>
										<option value="14">神奈川県</option>
										<option value="15">新潟県</option>
										<option value="16">富山県</option>
										<option value="17">石川県</option>
										<option value="18">福井県</option>
										<option value="19">山梨県</option>
										<option value="20">長野県</option>
										<option value="21">岐阜県</option>
										<option value="22">静岡県</option>
										<option value="23">愛知県</option>
										<option value="24">三重県</option>
										<option value="25">滋賀県</option>
										<option value="26">京都府</option>
										<option value="27">大阪府</option>
										<option value="28">兵庫県</option>
										<option value="29">奈良県</option>
										<option value="30">和歌山県</option>
										<option value="31">鳥取県</option>
										<option value="32">島根県</option>
										<option value="33">岡山県</option>
										<option value="34">広島県</option>
										<option value="35">山口県</option>
										<option value="36">徳島県</option>
										<option value="37">香川県</option>
										<option value="38">愛媛県</option>
										<option value="39">高知県</option>
										<option value="40">福岡県</option>
										<option value="41">佐賀県</option>
										<option value="42">長崎県</option>
										<option value="43">熊本県</option>
										<option value="44">大分県</option>
										<option value="45">宮崎県</option>
										<option value="46">鹿児島県</option>
										<option value="47">沖縄県</option>
									</select>
								市区町村番地など <input type="text" name="address2" size="60">
							</form>

郵便番号	-
都道府県
市区町村番地など