使用 CSS 隐藏行而不是使用 DataTables 删除节点

Posted 2023-05-07

【中文标题】使用 CSS 隐藏行而不是使用 DataTables 删除节点

【英文标题】：Hiding rows using CSS instead of removing the node with DataTables

【发布时间】：2013-10-24 20:47:41

【问题描述】：

如何在搜索而不是删除节点之后使用 DataTables 隐藏表中的行（使用 display:none）？

原因：在每一行中，我都有一个复选框，我希望即使隐藏行（搜索后）也能够发送值。默认情况下，如果我检查表中的字段并更改页面，则根本不会发送该值。

【问题讨论】：

用 .hide() 替换正在删除节点的内容

这是 dataTables 在您过滤/搜索时在内部执行的方式。然后，您可以通过 fnFiler() 以编程方式隐藏行，这是推荐的方式（如果您问我） - 或检查 dataTables 源代码并根据您的需要复制相同的代码。但是没有代码示例就很难提供帮助。

【参考方案1】：

如果不看更多代码，很难给出准确的答案。

基本上，您应该通过数据表的 api 访问它，而不是访问 table 节点：fnGetData / fnAddData / fnUpdate / fnDeleteRow（参见 documentation）

【参考方案2】：

您可以像这样将 CSS 添加到特定行上的所有单元格。

假设你想将visibility: hidden 添加到1 行的所有单元格中：

var table = $("#my-table-element").DataTable();
$(table.row( 1 ).node())
    .find("td")
    .css("visibility", "hidden");