JQury datatables 改變處理中 顯示樣式

datatables表格控制項真的很強大，默認的處理中只是一個黑色的文字，而且在表格頂部，不太好看，所以需要自定義修改它的樣式，參考官網的初始化設置表格的函數形式，連接如下：https://datatables.net/reference/event/processing，主要函數是這個：

2. $("#example"String).on( "processing.dt"String, function ( e, settings, processing ) {
4. $("#processingIndicator").css( "display", processing ? "block" : "none" );//官網設置隱藏與否
6. } )

以下是我設置表格樣式的過程：

1.第一步：就是找到表格中的處理中的id，然後使用css，設置它的樣式，如果你不知道處理中的id的話，可以使用瀏覽器，打開F12開發者模式，看看，如下圖片：

2.第二步：找到了這個處理中的id，就可以參照官網的形式，在表格初始化的時候，給他加上自己設置的樣式，（注意需要打開屬性可以使用處理中的："bProcessing" : true,"sProcessing" : "正在載入數據中，請稍候...",這些官網都是有例子的，我就不重複了）如下代碼：

2. var Table = $("#sample_1") .on( "processing.dt", function ( e, settings, processing ) {
3. $("#sample_1_processing").css( "color", processing ? "red" : "red" );//設置文字為紅色
4. $("#sample_1_processing").css( "display", processing ? "block" : "none" );
6. } ).dataTable(
7. datatables_options);

這樣就可以自定義了，成功之後的前後對比：

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！