bootstrap的table前端过滤

Bootstrap Table提供了许多前端过滤的选项，可以根据不同的需求选择使用。

1. 普通文本过滤

使用`data-filter-control="input"`属性来设置一个输入框，用户可以在输入框中输入关键字来过滤数据。示例代码如下：

<table id="table" data-toggle="table" data-url="data.json" data-filter-control="true">
  <thead>
    <tr>
      <th data-field="name" data-filter-control="input">姓名</th>
      <th data-field="age" data-filter-control="input">年龄</th>
      <th data-field="gender" data-filter-control="input">性别</th>
    </tr>
  </thead>
</table>

2. 下拉框过滤

使用`data-filter-control="select"`属性来设置一个下拉框，用户可以选择过滤条件。示例代码如下：

<table id="table" data-toggle="table" data-url="data.json" data-filter-control="true">
  <thead>
    <tr>
      <th data-field="name" data-filter-control="select">姓名</th>
      <th data-field="age" data-filter-control="select">年龄</th>
      <th data-field="gender" data-filter-control="select">性别</th>
    </tr>
  </thead>
</table>

3. 多选框过滤

使用`data-filter-control="checkbox"`属性来设置一个多选框，用户可以选择多个过滤条件。示例代码如下：

<table id="table" data-toggle="table" data-url="data.json" data-filter-control="true">
  <thead>
    <tr>
      <th data-field="name" data-filter-control="checkbox">姓名</th>
      <th data-field="age" data-filter-control="checkbox">年龄</th>
      <th data-field="gender" data-filter-control="checkbox">性别</th>
    </tr>
  </thead>
</table>

4. 日期选择器过滤

使用`data-filter-control="datepicker"`属性来设置一个日期选择器，用户可以选择日期进行过滤。示例代码如下：

<table id="table" data-toggle="table" data-url="data.json" data-filter-control="true">
  <thead>
    <tr>
      <th data-field="name">姓名</th>
      <th data-field="age">年龄</th>
      <th data-field="birthday" data-filter-control="datepicker">生日</th>
    </tr>
  </thead>
</table>

以上就是Bootstrap Table提供的一些前端过滤选项，你可以根据需要选择使用。