选中复选框时隐藏表中的记录

<table>
  <thead>
    <tr>
      <th></th> <!-- 复选框列 -->
      <th>列1</th>
      <th>列2</th>
      <th>列3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td><input type="checkbox"></td>
      <td>数据1</td>
      <td>数据2</td>
      <td>数据3</td>
    </tr>
    <tr>
      <td><input type="checkbox"></td>
      <td>数据4</td>
      <td>数据5</td>
      <td>数据6</td>
    </tr>
    <!-- 其他行... -->
  </tbody>
</table>

// 获取所有复选框元素
const checkboxes = document.querySelectorAll('input[type="checkbox"]');

// 监听复选框改变事件
checkboxes.forEach(checkbox => {
  checkbox.addEventListener('change', () => {
    // 获取当前复选框所在行
    const row = checkbox.parentNode.parentNode;

    // 根据选中状态显示或隐藏行
    if (checkbox.checked) {
      row.style.display = 'none'; // 隐藏行
    } else {
      row.style.display = ''; // 显示行
    }
  });
});