Question

这个javascript

$('#example').dataTable({"sPaginationType": "full_numbers",
        "bAutoWidth": false,
        "aoColumns": [
            { "width": "50%" },
            { "width": "100px" },
            { "width": "100px" },
            { "width": "50px" },
            { "width": "100px" }
        ]});

与此表一起

<table cellpadding="0" cellspacing="0" border="0" class="" id="example">
<thead>
<tr>
    <th>Rendering engine</th>
    <th>Browser</th>
    <th>Platform(s)</th>
    <th>Engine version</th>
    <th>CSS grade</th>
</tr>
</thead>
<tbody>
<tr>
    <td>Trident</td>
    <td>Internet
        Explorer 4.0</td>
    <td>Win 95+</td>
    <td> 4</td>
    <td>X</td>
</tr>
<tr>
    <td>Trident</td>
    <td>Internet
        Explorer 5.0</td>
    <td>Win 95+</td>
    <td>5</td>
    <td>C</td>
</tr>
<tr>
    <td>Trident</td>
    <td>Internet
        Explorer 5.5</td>
    <td>Win 95+</td>
    <td>5.5</td>
    <td>A</td>
</tr>
<tr>
    <td>Trident</td>
    <td>Internet
        Explorer 6</td>
    <td>Win 98+</td>
    <td>6</td>
    <td>A</td>
</tr>
<tr>
    <td>Trident</td>
    <td>Internet Explorer 7</td>
    <td>Win XP SP2+</td>
    <td>7</td>
    <td>A</td>
</tr>
</tbody>
</table>

结束不是固定大小的表。

首先，我不希望它是100％宽度，其次，将px或％放在js部分，根本没有效果。

我忽略了什么吗？

See here in this fiddle about the datatables auto column width problem

Answer 1

首先，我强烈建议您升级到1.10.x - ＆gt; http://www.datatables.net/download/ 或至少1.9系列的最新版本1.9.4。

然后，是的 - 当你使用1.9.0（所有1.9.x版本）时，列width选项被命名为sWidth。所以相反：

$('#example').dataTable({
   "sPaginationType": "full_numbers",
   "bAutoWidth": false,
   "aoColumns": [
      { "sWidth": "50%" },
      { "sWidth": "100px" },
      { "sWidth": "100px" },
      { "sWidth": "50px" },
      { "sWidth": "100px" }
   ]
});

要处理您的要求“我不希望它是100％宽度”，您必须指定表格的宽度，或者至少为max-width。否则，数据表将假设表的宽度应为100％，因此将"sWidth": "50%"列展开为剩下的任何值。因此，如果您希望表格为700px，例如：

#example {
    width: 700px;
}

你的小提琴分叉 - ＆gt;的 http://jsfiddle.net/9n5vrbnz/

如果你想要一个完全固定宽度，即表格和注入的控件，如搜索框和分页保持在一定宽度内，你可以设置包装元素的样式。它始终命名为<table id>_wrapper：

#example_wrapper { width: 700px; }

小提琴 - ＆gt;的 http://jsfiddle.net/1rce0d4k/

数据表aoColumns和bAutoWidth无法正常工作？

1 个答案: