实现datatable表格第一列在手机端固定

自用笔记，如有错误请指正。
<!– 插件js –><script src=”https://cdn.datatables.net/fi…;></script>
<!– 手机端样式 控制文字不换行 –>@media (max-width: 767px) {
table.dataTable tbody th,
table.dataTable tbody td {
white-space: nowrap;
}
}
<!– 初始化选项 –>$(“#table_table”).dataTable({
“filter”: false,
“destroy”: true,
“lengthChange”: true,
“searching”: false,
“ordering”: false,
“stateSave”: false, // 不记住 状态
“bDestory”: true,
“info”: true,
“autoWidth”: false,
“serverSide”: true,
“processing”: true,
“scrollX”: “1200px”,
//”scrollXInner”: “500%”,
//”scrollX”: true,//x方向滚动
//”displayLength”:”1200″,
“scrollCollapse”: false, //可滚动控制y方向
“fixedColumns”: { //固定列的配置项
leftColumns: 1, //固定左边第一列
// rightColumns:1 //固定右边第一列
},
其中这两个选项是关键，阅读了官方文档，scrollXInner这个选项已经不建议使用，会引起表头和表格对不齐这种问题，官方是为了维护用户旧代码才保留了这个选项。这点很关键，一开始我作出的效果整个都是不对齐的。 “scrollX”: “”,”scrollXInner”: “”,
“aoColumnDefs”: [
{ “sWidth”: “20%”, “aTargets”: [ 1 ] }
],
这个选项空着列宽的时候，手机端好像并不适用，需要注意一下，所以才出现了css中nowrap控制文字不换行这个操作，这一步也是官方文档推荐的