套接字组合

我们在工作时需要一个组合箱 在仔细观察了所有的选择之后 我对其中任何一个都不满意 这个项目的造型都建立在Twitter的"靴子"上, 以此为基础.

如何安装

您可以安装此插件 .

1. 手工下载

以前,这是安装插件的唯一方法. 您需要包含在 HTML 中的两个文件才能工作 :

1. js/bootstrap-combobox.js (英语)
2. css/bootstrap-combobox.css (中文(简体) )

2. 鲍尔安装

此插件现在已装入弓形! 如果你已经安装在机器上,只需使用命令:

bower install bootstrap-combobox

这将将插件安装到您的 bower 组件文件夹 。 详情请查阅 http://bower.io/ (中文(简体) )

怎样用

依赖性是靴子样式表(CSS或LESS). 包含它,然后是样式表( CSS 或 LESS) 和 javascript .

然后在普通选择框上激活插件( 建议先有空白选项):

<select class="combobox">
  <option></option>
  <option value="PA">Pennsylvania</option>
  <option value="CT">Connecticut</option>
  <option value="NY">New York</option>
  <option value="MD">Maryland</option>
  <option value="VA">Virginia</option>
</select>

<script type="text/javascript">
  $(document).ready(function(){
    $('.combobox').combobox();
  });
</script>

选项

启动插件时,您可能包含包含组合框选项的对象

$('.combobox').combobox({bsVersion: '2'});

menu: 自定义下拉菜单列表元素的标记.

item: 自定义下拉菜单列表项的标记.

matcher: 自定义一个函数 item 参数,将项目与输入进行比较。 在查询中默认匹配为项目的子字符串, 大小写提示

sorter: 自定义排序列表的函数 items 在下拉时显示

highlighter: 自定义用于突出显示的函数 item。默认在匹配的项目中粗体显示查询

template: 返回组合框标记的自定义函数.

bsVersion: 正在使用的靴子套版本。 默认使用此选项 template 函数生成正确的标记。 默认为"3". 设定为“ 2 ” , 用于兼容 Bootstrap 2

appendId: 已变换组合框所期望的ID. 这将变成 id attr , 并可以被映射到使用属性的标签 。 有用于无障碍.

依赖关系

使用最新1.X版本的jQuery和最新2.X或3.X的靴子套.

生活实例

Bootstrap 2.0 版本 :

http://dl.tropbox.com/u/21368/bootstrap-combobox/index.html 互联网档案馆的存檔,存档日期2014-12-21

脚步陷阱 3.0 版本

http://bootstrap-combobox-test.herokuapp.com/ 互联网档案馆的存檔,存档日期2013-12-22

许可证

根据Apache 许可证颁发的许可证,2.0版本