ホームページで住所自動入力フォームの簡単な設置
みなさまこんにちは
ニシザワです。
猛暑が続いていますね。
水分補給等大切なので適宜していきましょう！
さて、本日はJavaScriptを使った住所自動入力フォームの設置について。
簡単に設置できるライブラリがないか探していたところすばらしいのに出会いました。
名前はajaxzip3です！
こちらは、株式会社人気組の方たちが中心となって作られています。
こちらのすごいところは、合併などで地名が変わってもこちらでいちいち変更せずとも、変更してもらえると言うところと
設置がものすごく簡単なんです！
そして、商用も利用可能という心の広さ・・・
海外ではMITライセンスは多いですが日本でこんなにすばらしいのがMITライセンスで提供されているとは感激しました。
では、使い方を書いていきます。
まず、公式サイトをどうぞ
https://code.google.com/p/ajaxzip3/
使い方は本当にシンプルで
headなどに以下のリンクをはる
これで、終わりです。
すごくかんたんですよね。
ちなみに都道府県だけ選択にしたい場合もあると思いますがこれも対応しています！
こんな感じです。
最後までお読みいただきありがとうございます。
ニシザワです。
猛暑が続いていますね。
水分補給等大切なので適宜していきましょう！
さて、本日はJavaScriptを使った住所自動入力フォームの設置について。
簡単に設置できるライブラリがないか探していたところすばらしいのに出会いました。
名前はajaxzip3です！
こちらは、株式会社人気組の方たちが中心となって作られています。
こちらのすごいところは、合併などで地名が変わってもこちらでいちいち変更せずとも、変更してもらえると言うところと
設置がものすごく簡単なんです！
そして、商用も利用可能という心の広さ・・・
海外ではMITライセンスは多いですが日本でこんなにすばらしいのがMITライセンスで提供されているとは感激しました。
では、使い方を書いていきます。
まず、公式サイトをどうぞ
https://code.google.com/p/ajaxzip3/
使い方は本当にシンプルで
headなどに以下のリンクをはる
<head>
<script type="text/javascript" src="http://ajaxzip3.googlecode.com/svn/trunk/ajaxzip3/ajaxzip3.js"></script>
</head>
フォームに以下のように付け加える
<input name="zip" onkeyup="AjaxZip3.zip2addr('zip', //郵便番号の最初の3桁か7桁すべて '', //郵便番号の後ろの4桁 上で7桁入力の場合はからで入れる 'address1', //都道府県 'address2', //都道府県以下の住所 maxlength="8" type="text"> <input name="address1" type="text"> <input name="address2" type="text">同じ色の所は同じ名前をつけます。
これで、終わりです。
すごくかんたんですよね。
ちなみに都道府県だけ選択にしたい場合もあると思いますがこれも対応しています！
こんな感じです。
<input name="zip" onkeyup="AjaxZip3.zip2addr('zip', //郵便番号の最初の3桁か7桁すべて '', //郵便番号の後ろの4桁 上で7桁入力の場合はからで入れる 'address1', //都道府県 'address2', //都道府県以下の住所 maxlength="8" type="text"> <select name="address1"> <option value="0">都道府県</option> <option value="1">北海道</option> <option value="2">青森県</option> ・ ・ <option value="45">宮崎県</option> <option value="46">鹿児島県</option> <option value="47">沖縄県</option> </select> <input name="address2" type="text">本日は以上です。
最後までお読みいただきありがとうございます。
