dataTables JS插件响应宽度溢出设置div宽度

使用DataTables插件显示表格数据我发现当在表容器div上设置百分比宽度时，插件正在执行宽度计算并在表格上设置一个实际上比div宽的像素宽度。

在响应模式下以全宽度使用表时，这不是问题，但是当尝试半宽时，它会超出设置的宽度并强制浏览器窗口水平滚动。

码：

$('#' + tableID).dataTable({ "dom": 'Rlfrtip', "ajax" : file, "responsive": true, "columns" : columnDataMap, "order": [[ 1, "desc" ]], "sAjaxDataProp" : "items", colReorder: { fixedColumns: 1 }, "columnDefs": [ { "targets": 0, "sortable": false, "data": null, "defaultContent": '...' } ] }); 

Answer 1

初始化插件时，可以通过添加以下选项来阻止DataTables向表中添加（错误）宽度：

 "bAutoWidth":false, 

最终产品：

 $('#' + tableID).dataTable({ "dom": 'Rlfrtip', "ajax" : file, "responsive": true, "bAutoWidth":false, "columns" : columnDataMap, "order": [[ 1, "desc" ]], "sAjaxDataProp" : "items", colReorder: { fixedColumns: 1 }, "columnDefs": [ { "targets": 0, "sortable": false, "data": null, "defaultContent": '...' } ] });