javascript - 固定数据表上的列宽

Question

我有一个空表，直到用户执行某些操作。问题是，当表格为空时，列只有一个宽度，而当表格有内容(td 上的一些输入)时，宽度会改变。我想要的是保持列大小固定，即当表为空时和有内容时列大小相同。

以下代码显示了数据表配置。显示的宽度是我需要的，但是，例如，当表格为空时，第一列的 width 为 114px

tabla = $('#tabla').DataTable({
    language: {
        url: '/recursos/estilos/DataTables-1.10.1/js/locale/es_AR.json'
    },          
    "bSort": false,
    "bAutoWidth": false,
     aoColumns : [
      { "sWidth": "104px"},
      { "sWidth": "263px"},
      { "sWidth": "105px"},
      { "sWidth": "105px"},
      { "sWidth": "105px"},
      { "sWidth": "105px"},
      { "sWidth": "33px"},
    ]
}); 

Answer 1

我解决了这个问题只是在th 宽度固定宽度上添加div。

在表定义中，我有这个 HTML 和问题上显示的 Datatable 配置:

<thead>
    <tr>                            
        <th>Code</th>
    </tr>
    <tr>                            
        <th>Description</th>
    </tr>
</thead>

我现在所做的是在 HTML 上添加 div:

<thead>
    <tr>                            
        <th><div style="width: 100px;">Codigo</div></th>
    </tr>
    <tr>                            
        <th><div style="width: 300px;">Description</div></th>
    </tr>
</thead>

当前Datatable配置为:

tabla = $('#tabla').DataTable({
    language: {
        url: '/recursos/estilos/DataTables-1.10.1/js/locale/es_AR.json'
    },          
    "bSort": false
});