jQuery 数据表 - 使用列索引，检查 jQuery 数据表中的列是否可见/存在答案

【问题标题】：jQuery datatable - using column index, check if a column in jQuery datatable is visible/presentjQuery 数据表 - 使用列索引，检查 jQuery 数据表中的列是否可见/存在
【发布时间】：2012-02-20 21:30:10
【问题描述】：

由于my earlier post没有得到任何回应，我重新发布。

我正在使用 jQuery 的数据表，我偶尔会使用以下代码切换某些列的可见性

tableId.fnSetColumnVis(0, false);

完成之后，UI 上还有一些其他控件需要切换其可见性。所以，我需要检查（在页面加载时说）索引为 0 的列是否可见/隐藏/存在 - 无论如何。我正在寻找类似 $("#tableId").isColumnVisible(columnIndex);

请指教。谢谢

【问题讨论】：

如果您控制数据表，那么您已经有了答案。 tableId.fnSetColumnVis(0, false); 表示 0 不再可见。你为什么要指挥你的部队行军，然后问他们要去哪里？
感谢 Sintheta。我不确定你是否了解我的情况。假设我通过执行操作 X bu 隐藏了表格列，然后一系列其他操作 A、B 和 C 引导我检查表格列是否被隐藏..我将如何检查..？
谁在编写动作 A、B 和 C？还是你。我想我建议您重新审视如何控制页面上的元素。如果您要隐藏一个字段，则要么将其记录在某处，要么触发一个自定义事件，然后您可以监听您需要了解其可见性状态的任何内容。这不像用户在他们的控制台中输入tableId.fnSetColumnVis(0, false);，您可以完全控制这种情况何时发生以及它会带来什么。像您喜欢的答案一样将您的控件与您的视图紧密耦合总是会导致痛苦。

标签： jquery datatable visible

【解决方案1】：

我根本不知道 jquery 数据表，但我想您可以检查标题是否将 css 的 display 属性设置为 hide。示例代码：

if($("#tableId .th-1").css("display")=="none"){
   //do hidden related action
} else {
   //do visible related action
}

假设您正在检查的列具有类 th-1。如果您想要更通用的方法，我可以建议：

$("#tableId th").each(function(index, element){

    if($(this).css("display")=="none"){
       //do hidden related action
    } else {
       //do visible related action
    }

});

这将检查你的每一个表。

【讨论】：

感谢您的建议。我尝试了您的第一种方法并且它有效，但我通常不想依赖 CSS 类作为元素的选择器。我更愿意使用列索引（再次由变量引用）来解决这个问题，以避免 CSS 名称被更改的风险和解决方案的折腾。如果表中隐藏了超过 1 列，则第二种方法可能不好，对吧？
并非如此，如果有 2 个或更多隐藏列，则第二种方法仍然可以正常工作，因为它会一一搜索所有列并在每个列上应用 if else 指令。所以应该不错

【解决方案2】：

好吧，没有人能真正回答你的问题，我也在寻找这个微不足道的任务，我花了比预期更长的时间来找出如何去做。

这里是如何，真的很容易，但没有正确记录。

 /* Get the DataTables object again - this is not a recreation, just a get of the object*/
var oTable = $('#example').dataTable();

var bVis = oTable.fnSettings().aoColumns[iCol].bVisible;
oTable.fnSetColumnVis( iCol, bVis ? false : true );

本质上，fnSettings() 函数还具有可用的 aoColumns 属性，它将保存在初始化时设置的所有列属性。

如果您无法从可见列中获取正确的索引，您可以尝试使用此方法（尽管它似乎不适用于标题唯一的正文单元格，因此您必须进行一些计算才能确定标题单元格）。

$('.dataTable td').click( function () {
// Get the position of the current data from the node
var oTable = $(this).closest('.dataTable').dataTable();
var aPos = oTable.fnGetPosition( this );
console.log(aPos);
} );

【讨论】：