2014年9月12日(金) 23時54分56秒 [Web関連]

郵便番号の入力で住所を自動補完する仕組みを個人サイトにも付ける方法

郵便番号を入力するだけで該当する住所が自動入力(補完)される仕組みを、自分のウェブサイト内にある入力フォームに組み込む方法を、All Aboutで記事にしました。
個人サイトや小規模なサイトでも、同人誌の通販とかイベントの参加申し込みとかそんな感じの入力フォームで、住所の入力を求める機会はありそうです。

◆郵便番号からの住所自動入力機能を設置する方法（＠All About ホームページ作成）

jQueryプラグインである「jquery.jpostal.js」を使えば、既存の入力フォームに住所の自動補完機能を加えるのも簡単です。対象のフォームにあまり制約がないので、既存のフォームを特に変更することなく、住所の自動補完機能を加えられます。
しかも、ユーザが郵便番号を入力した瞬間に住所が自動検索されて補完入力されるため、ページ遷移やサブウインドウの表示などの煩わしいステップがないため、動作は軽快です。

住所が自動入力できると、ユーザ側の手間が省けるだけでなく、入力ミスが防げるのでその住所を発送等に利用する側も、郵便物の不達を防げて便利だと思います。
記事中には、サンプルページも掲載していますので、そのHTMLソースをコピー＆ペーストすると楽に試せると思います。
住所の入力を求める場面で、ぜひ活用してみて下さい。

(余談)
記事中に掲載する郵便番号の入力例を何にしようかな……と思って、「529-0425」の「滋賀県長浜市 木之本町 木之本」とかどうかな……？ と一瞬思ったんですが、まあ、大人しくAll About本社のある「150-0013」(東京都渋谷区恵比寿)にしておきました。(^_^;;;