javascript - 以自然宽度显示 DataTables 列

Question

我正在使用 DataTables 库，我正在使用autoWidth选项让 DataTables 自动设置列宽，并使用Scroller 插件来修复来自服务器的标题和页面数据。

当我的表有大量列时，这种组合看起来很漂亮，但是当它只有几列时，autoWidth 设置会使它们变得卡通般大。

这是一个例子：

大柱子

我想要的是表格的宽度与其内容所需的一样宽，而不是更宽。有时这意味着内容对于视口来说太宽并且必须水平滚动，有时这意味着内容比视口窄，在这种情况下我不希望它占用整个水平空间。

如果我愿意硬编码表格的最大宽度，我已经找到了几种可行的方法，但是这样做依赖于我自己编写代码来估计列的宽度。显然，这取决于各种困难的测量（字体大小、内容宽度等），我真的宁愿留给 DataTables。

是否有某种方法可以配置 DataTables，或者使用包装 DOM 元素和样式，以便它始终只使用必要的宽度来绘制表格？

score 3 · Accepted Answer

嗯 - 不知道是不是你在找 - 但如果你设置

#example {
    display: block;
}

并columns().adjust()在初始化后立即运行

var table = $('#example')
    .DataTable()
    .columns()
    .adjust()
    .draw();

然后列将缩小到绝对最小大小。
演示-> http://jsfiddle.net/j5h9ob12/1/

更新，在小提琴中编辑标题以强调这一点。

1 回答 1