数据表无论视口如何,响应总是隐藏列

时间:2018-02-16 09:51:51

标签: responsive-design datatables

我已成功配置了响应式通用DataTable。我所追求的是强制 DataTable有一个隐藏列,无论它显示的是什么视口。

我尝试搜索任何可能对我有帮助的事情here,但没有运气。

1 个答案:

答案 0 :(得分:0)

找到我想要实现的目标。您必须将 class =" none" 添加到您打算始终隐藏的列的标题中。

<table id="example" class="display" width="100%">
    <thead>
        <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th class="none">Age</th>
            <th class="none">Start date</th>
            <th>Salary</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Tiger Nixon</td>
            <td>System Architect</td>
            <td>Edinburgh</td>
            <td>61</td>
            <td>2011/04/25</td>
            <td>$320,800</td>
        </tr>
        <tr>
            <td>Garrett Winters</td>
            <td>Accountant</td>
            <td>Tokyo</td>
            <td>63</td>
            <td>2011/07/25</td>
            <td>$170,750</td>
        </tr>
    </tbody>
</table>

然后只需使用Responsive插件初始化datatable

$(document).ready(function() {
  $('#example').DataTable();
});