如何隐藏DataTables中的标题行？

Question

我想隐藏表头行，使其不可见。 （从台式机和移动设备上观看时）

我试过了：

"drawCallback":function(settings ){$("#mySelection thead").remove();} ,

尽管这段代码似乎以我想要的方式呈现了表格（无标题），但它也影响了此处使用的按钮的输出。 这些按钮设置为输出任何可见的（由列可见性切换）。

不幸的是，此代码不仅删除了导出输出中的剧院，而且还删除了表中的所有数据。

当我尝试时会发生相同的事情：

$("#mySelection thead").hide()

无论如何，是否仍要像以前一样保留输出，并且仅在视图中隐藏表标题，就像在带有列标题的行中一样？ 我想保持表格数据上的按钮（复制，excel，pdf，colvis）正常工作。

https://jsfiddle.net/287fum2q/

编辑：

在CSS中使用以下代码会导致在问题的第一部分中提到的问题：

.ui.table thead { display: none !important; }

就像这样：

thead { display: none!important; }

如果您可以包括保存的jsfiddle来显示解决方案，那将更加有用。

Answer 1

thead css与semanticui.min.css thead发生冲突，因此使用!important覆盖css

.ui.table thead {
    display: none !important;
}

Answer 2

看来DataTables Jquery插件可能存在错误。 DataTables假定标题显示不会设置为none 。 当您设置标题display:none它会阻止DataTables按钮按预期方式工作。

这是您的解决方法 ：

  .ui.table thead {
    position: absolute !important;
    top: -9999px !important;
    left: -9999px !important;
  } 

这样可以使标题不可见，但是DataTables按钮仍然具有正常工作所需的功能。 我刚刚了解到这可能是一个好习惯（令人惊讶的是），因为display:none 使得屏幕阅读器“无法访问”内容。