リストやテーブルから文字列を検索する（絞り込む）プラグイン「Searcher」を紹介します。
Searcher
このプラグインを使えば、候補の多いリストやテーブルから文字列を絞り込むことができます。文字を入力すると動的に候補が絞りこまれていくので、ユーザーの利便性に最適ですね。
デモのインプットフォームに文字列を入力し、テーブルのコンテンツを検索してみてください。
「Searcher」のデモ
デモのソース（HTML + jQuery）
<meta name="description" content="Searcherのデモでーす。"> |
<title>Searcher - jQueryプラグイン</title> |
<input id="tablesearchinput" /> |
<tr><td>1992</td><td>スペイン（Spain）</td><td>バルセロナ（Barcelona）</td></tr> |
<tr><td>1996</td><td>アメリカ合衆国（United States）</td><td>アトランタ（Atlanta）</td></tr> |
<tr><td>2000</td><td>オーストラリア（ Australia）</td><td>シドニー（Sydney）</td></tr> |
<tr><td>2004</td><td>ギリシャ（Greece）</td><td>アテネ（Athens）</td></tr> |
<tr><td>2008</td><td>中国（China）</td><td>北京（Beijing）</td></tr> |
<tr><td>2012</td><td>イギリス（United Kingdom）</td><td>ロンドン（London）</td></tr> |
<tr><td>2016</td><td>ブラジル（Brazil）</td><td>リオデジャネイロ（Rio de Janeiro）</td></tr> |
<tr><td>2020</td><td>日本（Japan）</td><td>東京（Tokyo）</td></tr> |
<script src="http://code.jquery.com/jquery.js"></script> |
<script src="jquery.searcher.js"></script> |
$("#tabledata").searcher({ |
inputSelector: "#tablesearchinput" |
jsファイルのダウンロードやオプションなどの詳細はこちらからどうぞ。
» Searcher