住所の単語から郵便番号を検索する jQuery coder プラグイン
jQuery coder プラグインは Postal Search Ajax API の Postal.Coder クラス を jQuery プラグインにラップしたものです。Postal Coder Plugin を使うと Postal.Coder クラスが持つ住所の単語から郵便番号を検索する機能を jQuery のメソッドチェーンの中で利用できます。
住所の単語から郵便番号を検索するときは coder メソッドを使います。coder メソッドの引数には住所の単語とコールバック関数を指定します。coder メソッドはその中で Postal.Coder クラスをを使って住所の単語から郵便番号を検索し、その結果をコールバック関数を使って伝えます。このときの検索は非同期です。
コールバック関数の引数は検索結果とステータスコードです。検索結果は Postal.Coder クラスの response プロパティに対応します。住所の単語から郵便番号が見つからないときは空の配列になります。ステータスコードは Postal.Coder クラス の status プロパティに該当します。エラーが発生したときは 200 以外の値になります。
デモ
次のサンプルは住所の単語 "新宿" の郵便番号を検索するものです。はじめに検索中を表す loading ... というテキストを表示し、その後 coder メソッドを使って住所の単語から郵便番号を検索しています。郵便番号が見つかったときは、前述の loading... を上書きして郵便番号をリスト表示しています。
<div id="r1"></div> <script type="text/javascript"> //<![CDATA[ jQuery(function($) { $('#r1') .text('Loading ...') .coder('新宿', function(response) { var ul = $('<ul />'); $.each(response, function() { $('<li />') .text(this.c) .appendTo(ul); }); $(this) .empty() .append(ul); }); }); //]]> </script>
検索のタイムアウトを長くするときは $.coderSetup メソッドを使います。タイムアウトの初期値は30秒です。通常は変更せずそのまま使います。$.coderSetup メソッドは Postal.Coder クラスのコンストラクタのオプションに対応します。
$.coderSetup({ timeout: 180 });
jQuery coder プラグインは Postal Search Ajax API に組み込んで配布しています。詳しくは Postal Search Ajax API リファレンス をご覧ください。
関連情報
- fixedUI プラグイン
- jTemplates
- Cycle Plugin
- Flash Plugin
- tablesorter
- Interface Elements
-
- Interface Elements の Carousel とフォートラベル API で旅行写真の 3D ギャラリーを作る
- Interface Elements の Imagebox とフォートラベル API で旅行写真のギャラリーを作る
- Interface Elements の Slider で郵便番号を入力してみたが・・・
- Interface Elements の Slider で旅行写真を拡大(または縮小)表示する
- Interface Elements の Tooltips をいろいろな要素で使ってみた
- Interface Elements の Scrollto でページ内リンクをスムースにする
- Interface Elements の Carousel と YouTube Data API で動画のサムネイルを回転表示する
- Selectors
- Events
- DOM Manipulation
- AJAX
- Forms with Functions
- Using with Other Libraries
- Books
- Resources