与多个复选框

Question

Gmail中有功能，您可以选择使用复选框标签和它隐藏一个div元素，用户可以上下滚动内选择要素。

它还允许您进行自定义操作，如在底部创建新标签。

它还允许您使用简单的搜索栏在顶部进行过滤。

什么是最简单的方式来实现类似的东西，并允许我把自定义的操作，如创建新的标签在底部？

在最低限度有一个方法来显示可滚动div或select元素中的所有复选框。

UPDATE：

目前，我只有以下复选框

<div class="input select"> 
    <label for="SiteSite">Sites</label> 
    <input type="hidden" name="data[Site][Site]" value="" id="SiteSite"> 

<div class="checkbox"><input type="checkbox" name="data[Site][Site][]" value="1" id="SiteSite1"><label for="SiteSite1">ODSite:P11379-440YishunAve11 HWSW_ESTA ENO21.000070.10001 92640145</label></div> 
<div class="checkbox"><input type="checkbox" name="data[Site][Site][]" value="2" id="SiteSite2"><label for="SiteSite2">ODSite:P11374-SGRecClub HWSW_ESTA ENO21.000070.10002 92640147</label></div> 

</div> 

Answer 1

您可以使用一个名为Select2插件，它拥有所有你从一个<SELECT>标签期待的选项。

http://img594.imageshack.us/img594/543/select2.png