原文地址：https://www.jianshu.com/p/fc4784d11722
昨天遇到一個問題，datatable生成的表格沒有數據，但是“No data found”沒有居中，根本原因是clospan屬性值設置不正確。排查發現這個問題只出現在渲染時處於不可見狀態的表格。
解決辦法：改jquery.dataTables.js的源碼。return$(_pluck( oSettings.aoColumns,'nTh') ).filter(':visible').length;這一步返回的是可見列的數量，改成return$(_pluck( oSettings.aoColumns,'nTh') ).length;就是返回所有列的數量。如果采取這種辦法，請先保證不會影響其他功能。
通過很長時間的研究，確定是jQuery dataTables.js的問題。找到了空數據時生成的邏輯。源代碼如下：
/* Table is empty - create a row with an empty message in it */
varsZero=oLang.sZeroRecords;
if( oSettings.iDraw==1&&_fnDataSource( oSettings ) =='ajax')
{
sZero=oLang.sLoadingRecords;
}
else if(oLang.sEmptyTable&& oSettings.fnRecordsTotal() ===0)
{
sZero=oLang.sEmptyTable;
}
關鍵代碼：
'valign':'top',
'colSpan':_fnVisbleColumns( oSettings ),
'class': oSettings.oClasses.sRowEmpty
} ).html(sZero) )[0];
一直要找的就是這個屬性，看看這個函數時如何定義的吧。看名字就知道應該和可見的列有關。愈加證明我的推測了。
/**
* Get the number of visible columns
*@param{object} oSettings dataTables settings object
*@returns{int} i the number of visible columns
*@memberofDataTable#oApi
*/
function_fnVisbleColumns( oSettings )
{
return$(_pluck( oSettings.aoColumns,'nTh') ).filter(':visible').length;
}
到這里終於找到了問題的原因，原來dataTable的clospan屬性是獲取所有可見列的數量。如果當時表格是隱藏的，那么可見的列數自然為0，所以clospan屬性也就設置為0。當表格再次可見時，colspan的值為0，所以提示信息沒有居中。