可以使用BootstrapTable中的onLoadSuccess事件来实现这个需求。

首先,在HTML中设置表格的checkbox列:

<table id="table">
  <thead>
    <tr>
      <th data-checkbox="true"></th>
      <th data-field="id">ID</th>
      <th data-field="name">Name</th>
      <th data-field="price">Price</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td></td>
      <td>1</td>
      <td>Item 1</td>
      <td>$10</td>
    </tr>
    <tr>
      <td></td>
      <td>2</td>
      <td>Item 2</td>
      <td>$20</td>
    </tr>
    <tr>
      <td></td>
      <td>3</td>
      <td>Item 3</td>
      <td>$30</td>
    </tr>
    <tr>
      <td></td>
      <td>4</td>
      <td>Item 4</td>
      <td>$40</td>
    </tr>
  </tbody>
</table>

然后,在JavaScript中监听onLoadSuccess事件,获取到表格数据并循环遍历每行数据,判断id是否大于1,如果是则设置checkbox为勾选状态。

$('#table').bootstrapTable({
  onLoadSuccess: function(data) {
    var $table = $(this);
    var rows = $table.bootstrapTable('getData');
    for (var i = 0; i < rows.length; i++) {
      var row = rows[i];
      if (row.id > 1) {
        $table.bootstrapTable('check', i);
      }
    }
  }
});

这样,当表格加载完成后,会自动将id大于1的行的checkbox设置为勾选状态


原文地址: https://www.cveoy.top/t/topic/dxi7 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录