フォーム入力内容に近い言葉だけ表示するjQueryプラグイン「flexselect」

フォームをselectしたとき選択項目が多いと縦長になってユーザビリティが低下します。
そんな悩みを解決するのが、jQueryプラグイン「flexselect」
入力内容に近い言葉をだけを残してくれます・・・日本語は通りませんが。

使用方法

flexselectからファイル一式をダウンロードします。


<link rel="stylesheet" href="flexselect.css" type="text/css" media="screen" />
<script src="jquery-1.3.js" type="text/javascript"></script>
<script src="liquidmetal.js" type="text/javascript"></script>
<script src="jquery.flexselect.js" type="text/javascript"></script>
<script>
jQuery(document).ready(function() {
  $("select[class*=flexselect]").flexselect();
});
</script>

あとは以下のようにあらかじめ選択させたい言葉を記述すれば完成です。


<select class="flexselect">
        <option value="1">George Washington</option>
        <option value="2">John Adams</option>
        <option value="3">Thomas Jefferson</option>
</select>

※重ね重ね日本語通りません・・・。

サンプル

Javascriptサンプルページ一覧

skuare.net