DataTables技术求助：获取隐藏td的data-href、强制更新stateSave

问题一：点击表格行获取隐藏列的data-href属性 #

你当前用table.row(this).data()[0]只能拿到单元格的文本内容，因为row().data()返回的是DataTables存储的单元格文本数据，不是DOM元素本身。要获取data-href属性，你需要直接操作对应的DOM元素：

解决方案 #

可以通过两种方式实现，任选其一即可：

$(document).on('click', '#dt tbody tr', function () {
    // 方法1：借助DataTables的row API获取行DOM节点
    const targetTd = table.row(this).node().querySelector('td:first-child');
    const href = targetTd.getAttribute('data-href');
    
    // 方法2：直接用jQuery操作当前行DOM（更简洁）
    // const href = $(this).find('td:first').data('href');
    
    if (href) {
        window.open(href, '_blank'); // 也可以用 window.location.href = href; 直接跳转
    }
});

原理：即使列被设置为visible: false，对应的<td>元素依然存在于DOM中（只是被CSS隐藏），所以可以通过DOM选择器直接获取它的属性。

问题二：stateSave时忽略列的visible状态 #

你提到的参考方案是完全可行的，核心思路是利用stateSaveParams回调函数，在DataTables将状态保存到localStorage之前，主动删除列的visible属性，这样下次加载表格时就不会被旧的列可见状态覆盖，而是使用初始化时的配置。

完整实现代码 #

const table = $('#dt').DataTable({
    columnDefs: [ {targets: [0], visible: false} ],
    stateSave: true,
    stateDuration: 0,
    stateSaveParams: function (settings, data) {
        // 遍历所有列，删除visible属性，让所有列的可见性遵循初始化配置
        data.columns.forEach(function (column) {
            delete column.visible;
        });
        
        // 如果你只想忽略特定列的visible状态，可以加判断条件
        // data.columns.forEach(function (column, index) {
        //     if (index === 0) { // 只忽略第一列的可见状态
        //         delete column.visible;
        //     }
        // });
    }
});

原理说明 #

stateSaveParams会在状态数据被保存前触发，你可以在这里修改要存入localStorage的data对象。删除column.visible后，存储的状态就不会包含列可见性的信息，每次初始化表格时都会严格遵循columnDefs里配置的visible设置。

内容的提问来源于stack exchange，提问作者Syllz