logo jQueryに強い、基本料金0円。わかりやすい料金設定でご提供する、
コーディング代行サービス「ココマチ コーディングラボ」
03-6432-0915

MENU

スタッフブログ

お見積り依頼

第2回:Ajaxによるインクリメンタルサーチ


今回、実装には “Ajax AutoComplete for jQuery” というプラグインを使用します(jquery.autocomplete.js)。 コードはこのようになります。 キーワードを1文字入れるごとに /ajax/autoSuggest にアクセスして結果を取得し、マッチ部分の文字列にstrongタグを付けてくれます。 ================================= イメージ画像 – ECサイトのブランド検索の例
a 入力時
a 入力時

ad 入力時
ad 入力時

adam 入力時
adam 入力時
================================= 自分で書いた部分には onchange などのイベントは指定していませんが、jquery.autocomplete.js の中を見ると setinterval で時間ごとにチェックしているようです。
以上、AjaxとjQueryによるインクリメンタルサーチの実例をご紹介しました。 お読みいただきありがとうございました。