javascriptで入力補完、入力候補表示


Memoです。


すごいものを発見してしまいました。
Enjoy*Study suggest.js - 入力補完ライブラリ


内容は次です。(ホームページより抜粋)

・入力内容をもとに検索を行い、補完候補を表示します。(Google Suggestぽく)
・Ajaxでは無く、初回画面表示時のみデータの読み込みを行い、それ以降は、クライアント側で対象データから検索します。したがって、入力内容に変化があってもサーバ側にアクセスすることはありません。
・検索は、前方一致/部分一致、大文字と小文字の区別あり/なしといったように、オプションで簡単に指定できます。また、その他にも様々なオプションが指定可能です。
・検索結果の表示上限を指定できます。(デフォルト上限20件)
・補完候補はキーボードの上下と、マウスにて選択できます。また、キーボードで選択中にESCキーでキャンセルといったような操作も可能です。
・スペース区切りで、複数キーワードの入力補完が行えます。
・IMEで入力中であっても、検索が行われます。


早速使わせて頂きます。


サンプルも5種類おいてあり、
使い方もすごく丁寧に解説してあったので、
すんなり導入できました。


追記:
導入後の画面サンプルです。


また、第三引数のlistの指定方法は、次のような感じで行うといいようです。

var list = [ 'Java', 'JavaScript', 'Perl', 'Ruby', 'PHP', 'Python', 'C', 'C++', '.NET','MySQL', 'Oracle', 'PostgreSQL'];