如何隱藏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 使得屏幕閱讀器“無法訪問”內容。