如何为Responsive DataTables设置responsivePriority指定列固定显示在子行

首先要明确一个关键细节：DataTables的targets参数是从0开始计数的，你要处理的Data6、Data7、Data8对应的列索引是5、6、7——之前你设置targets:8其实是选中了Data9，这就是为什么只有Data9进入子行的原因。

要让这三列永远只出现在子行，绝不显示在父行，只需给它们设置足够大的responsivePriority数值：

• responsivePriority的数值越大，列的优先级越低，越会优先被移到子行
• 默认列的优先级在10000以内，所以只要设置超过10000的值，就能确保这些列的优先级低于所有默认列，任何屏幕尺寸下都只会出现在子行

直接用以下配置即可：

$('#你的表格ID').DataTable({
  responsive: true,
  columnDefs: [
    // 一次性选中Data6、7、8对应的索引5、6、7，设置低优先级
    { responsivePriority: 10001, targets: [5, 6, 7] }
  ]
});

如果需要调整这三列在子行里的顺序，可以给它们设置不同的数值（数值越大，在子行里越靠后），比如：

columnDefs: [
  { responsivePriority: 10001, targets: 5 }, // Data6，子行里靠前
  { responsivePriority: 10002, targets: 6 }, // Data7，中间
  { responsivePriority: 10003, targets: 7 }  // Data8，子行里靠后
]

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