42
48

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

【ajaxzip3】郵便番号を入力すると住所が自動入力されるライブラリ

Last updated at Posted at 2016-03-28

郵便番号を入力すると自動で住所を入力してくれるライブラリの使い方です。
簡単過ぎて感激です。
開発者はユーザー思いのとっても優しい人なんだろうと勝手に妄想してしまいました。

以下URLよりajaxzip3をダウンロードし設置、javascriptを記述。
ajaxzip3

<script type="text/javascript" src="js/ajaxzip3.js"></script>

ダウンロードめんどくせーって方は以下の記述でもOK。

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

まず郵便番号と住所のフォームを設置。

<form>
    <input type="text" name="zip" />
  <input type="text" name="address" />
</form>

郵便番号のinputに以下を追加するだけ。

onKeyUp="AjaxZip3.zip2addr(郵便番号(全てまたは上3桁),郵便番号(下4桁),都道府県,市区町村,丁目番地,町域大字);"

上記のフォームに設置する場合、

<form>
  <input type="text" name="zip" onKeyUp="AjaxZip3.zip2addr(this,'','address','address');"/>
  <input type="text" name="address" />
</form>

たったこれだけ。マジ簡単過ぎる。。。
ちなみに郵便番号ハイフン有り無し対応。マジ便利過ぎる。。。

郵便番号上3桁と下4桁を分けた場合や住所が分割されている場合も対応可能。
その場合に設置は実際使った際に追記します。

42
48
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
42
48

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?