B-hind REDRUM

B-hind REDRUM

郵便番号入力で住所を自動表示する [js]

郵便番号入力で住所を自動表示する [js]

お問い合わせフォームなどで「住所」を都道府県から手打ちで入力するのは面倒なので、郵便番号を入力するだけでその後の住所を自動入力してくれる javascript「ajaxzip3」

ajaxzip3 の設置

<head> 内に ajaxzip3.js ファイルを設置します。

<head>
<script src="https://ajaxzip3.googlecode.com/svn/trunk/ajaxzip3/ajaxzip3-https.js" charset="UTF-8"></script>
</head>

でも良いけど、Google Codeが2016年1月26日に閉鎖するらしいから

以下の様にgithubにしておく。

<head>
<script src="https://ajaxzip3.github.io/ajaxzip3.js" charset="UTF-8"></script>

</head>

ajaxzip3.js ファイルをダウンロードして、<head> 内に設置でもOK。

<head>

<script src="./ajaxzip3.js" charset="UTF-8"></script>

</head>

 

HTMLの設定

郵便番号のinput要素にonKeyUpを記載します。
基本的な設定は、onKeyUp=”AjaxZip3.zip2addr(郵便番号（全てまたは上3桁）郵便番号（下4桁）都道府県,市区町村,丁目番地);となり、それぞれname属性を記載。
（都道府県をプルダウンメニューにすることも出来るが、自動表記なので個人的に必要性を感じず。。。）

<form action="./" method="post">
    〒 <input type="text" name="zip" onKeyUp="AjaxZip3.zip2addr(this,'','address','address');">
    住所 <input type="text" name="address" size="60">
</form>
〒
住所

 

ajaxzip3.js ファイルをダウンロード、直接アップして<head> 内にパス記述ならGoogle Code閉鎖云々は気にしないでOK

Return Top