フォーム入力のシステムを作っていると、郵便番号と住所を入れる場面が多々あると思います。郵便番号入れているのに、住所を入れるの面倒くさいです。
郵便番号からある程度住所を補完してくれると非常にユーザビリティが向上します。そんな機能を簡単に実装することができるjQueryプラグインの紹介です。
■郵便番号→住所へ変換してくれるjQueryプラグイン【jpostal】
GitHub上にプロジェクトが存在しています。動作デモはこちらです。
利点として、github上で郵便番号と住所の関連情報のjsonを管理してくれているので、サーバ上に大量の郵便番号→住所のjson的な物を持っておかなくても良いです。住所の更新も自動となります。
サンプルスクリプトは以下のとおりです。とても簡単に実装することができます。
<html>
<head>
<script src="//ajax.aspnetcdn.com/ajax/jQuery/jquery-1.11.1.min.js"></script>
<script src="//jpostal-1006.appspot.com/jquery.jpostal.js" type="text/javascript"></script>
<script>
$(document).ready(function(){
$('#zipcode').jpostal({
postcode : [
'#zipcode',
],
address : {
'#address' : '%3%4%5%6',
}
});
});
</script>
</head>
<body>
郵便番号
<input name="zipcode" class="form" type="text" id="zipcode">
住所
<input name="address" class="form" type="text" id="address">
</body>
</html>
ほんの少しフォームに手を加えるだけで、劇的にユーザビリティが向上します。運用も簡単なので、ぜひ導入を検討してみてください。では
