使用OnChecked事件过滤网格视图

// HTML部分
<input type="checkbox" id="filterCheckbox" onchange="filterGridView()" />
<label for="filterCheckbox">筛选</label>

<table id="gridView">
  <tr>
    <th>姓名</th>
    <th>年龄</th>
    <th>性别</th>
  </tr>
  <tr>
    <td>张三</td>
    <td>25</td>
    <td>男</td>
  </tr>
  <tr>
    <td>李四</td>
    <td>30</td>
    <td>女</td>
  </tr>
  <tr>
    <td>王五</td>
    <td>28</td>
    <td>男</td>
  </tr>
</table>

// JavaScript部分
function filterGridView() {
  var checkbox = document.getElementById("filterCheckbox");
  var gridView = document.getElementById("gridView");

  if (checkbox.checked) {
    // 根据条件筛选数据并显示
    // 例如，只显示性别为男的数据
    for (var i = 1; i < gridView.rows.length; i++) {
      var gender = gridView.rows[i].cells[2].innerHTML;
      if (gender !== "男") {
        gridView.rows[i].style.display = "none";
      }
    }
  } else {
    // 显示所有数据
    for (var i = 1; i < gridView.rows.length; i++) {
      gridView.rows[i].style.display = "";
    }
  }
}