Bootstrap可多选(带checkbox)、搜索的下拉列表
时间: 2023-09-12 11:08:17 浏览: 264
bootstrap-select下拉选择搜索框,可以多选和单选
是的,Bootstrap提供了一个称为"Dropdowns"的组件,可以实现带有复选框和搜索功能的下拉列表。你可以使用Bootstrap的Dropdowns组件来创建这样的下拉列表。以下是一个简单的示例代码:
```html
<div class="dropdown">
<button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
选择
</button>
<div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
<input class="form-control form-control-sm" type="text" placeholder="搜索...">
<div class="dropdown-divider"></div>
<a class="dropdown-item">
<input type="checkbox"> 选项1
</a>
<a class="dropdown-item">
<input type="checkbox"> 选项2
</a>
<a class="dropdown-item">
<input type="checkbox"> 选项3
</a>
</div>
</div>
```
在这个示例中,我们使用了Bootstrap的按钮和下拉菜单样式,并在下拉菜单中添加了一个输入框和多个带有复选框的选项。你可以根据需要修改和扩展这个示例,以满足你的具体需求。
阅读全文