原文地址：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，所以提示信息没有居中。