datatables销毁表格重建表格

         $("#mydatatables").dataTable().fnClearTable();
            $('#mydatatables').dataTable().fnDestroy()
            $('#mydatatables').empty();
            var tr='<thead>'
            +'<tr style="font-size: 16px !important">'
                +'<th id="sx" rowspan ="2" style="text-align:center">县</th>'
                +'<th rowspan ="1" colspan="3" style="text-align:center">下达资金</th>'
                +'<th rowspan ="2"  style="text-align:center;width:10%;">支出资金</th>'
                +'<th rowspan ="2"  style="text-align:center;width:10%;">剩余资金</th>'
                 +'<th rowspan ="2" colspan="1" style="text-align:center;width:10%;" title="支出资金/下达资金">执行进度(%)</th>'
                +'<th rowspan ="2" colspan="1" style="text-align:center;width:10%;" title="支出资金/下达资金">序时进度(%)</th>'
                +'<th rowspan ="2"  style="display: none"></th>'
            +'</tr>'
            +'<tr style="font-size: 16px !important">'
                +'<th rowspan ="1"  style="text-align:center">合计</th>    '                    
                +'<th rowspan ="1" style="text-align:center" title="本地区下达的中央资金">中央</th>'
                +'<th rowspan ="1" style="text-align:center" title="本地区下达的省级资金">省级</th>'
            +'</tr>';
             $('#mydatatables').append(tr);
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
使用 DataTables 实现表格自动滚动可以通过以下步骤完成: 1. 引入 DataTables 的 CSS 和 JavaScript 文件。您可以从官网下载或使用 CDN 引入。 ```html <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/dt/dt-1.10.22/datatables.min.css"/> <script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.22/datatables.min.js"></script> ``` 2. 在 HTML 中创建一个表格,并将其 ID 设置为 "myTable"。 ```html <table id="myTable"> <thead> <tr> <th>Header 1</th> <th>Header 2</th> <th>Header 3</th> </tr> </thead> <tbody> <tr> <td>Row 1, Column 1</td> <td>Row 1, Column 2</td> <td>Row 1, Column 3</td> </tr> <tr> <td>Row 2, Column 1</td> <td>Row 2, Column 2</td> <td>Row 2, Column 3</td> </tr> <tr> <td>Row 3, Column 1</td> <td>Row 3, Column 2</td> <td>Row 3, Column 3</td> </tr> ... </tbody> </table> ``` 3. 初始化 DataTables 并启用自动滚动功能。您可以使用以下代码: ```javascript $(document).ready(function() { $('#myTable').DataTable({ "scrollY": "200px", // 表格高度 "scrollCollapse": true, // 自动隐藏滚动条 "paging": false, // 禁用分页 "info": false, // 禁用信息 "order": [[ 0, "desc" ]], // 按照第一列倒序排列 "scrollX": true, // 水平滚动 "autoWidth": false, // 禁用自动宽度 "scrollCollapse": true, // 自动隐藏滚动条 "searching": false, // 禁用搜索 "deferRender": true, // 延迟渲染 "fnDrawCallback": function() { // 每次绘制表格时滚动到底部 $('#myTable').scrollTop($('#myTable')[0].scrollHeight); } }); }); ``` 上述代码中,我们首先使用 `DataTable()` 方法初始化表格,并指定表格高度、禁用分页、信息和搜索,按照第一列倒序排列等设置。然后在 `fnDrawCallback` 回调函数中,我们在每次绘制表格时滚动到表格底部。 通过以上步骤,您就可以使用 DataTables 实现表格自动滚动了。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值