Datatables跳转到指定页

2018-06-24 00:44:43来源：未知阅读 ()

因为项目用到Datatables发现在分页特别多时无法跳转到指定页，自己动手增加了#Datatables 跳转到指定页#功能，实现代码如下：

table = $('#user-table').dataTable({
    "bAutoWidth": false,
    "processing": true,
    "serverSide": true,
    "bStateSave":true,
    "pagingType": "full_numbers",
    "order": [[0, 'asc']],
    "ajax": get_users,
    "oLanguage": {
        "sUrl": "/js/advanced-datatable/lang/Chinese.json"
    },
    "drawCallback": function( settings ) {
        if ($('body').height() < document.documentElement.clientHeight) {
            $('footer').css('position','fixed');
        } else {
            $('footer').css('position','static');
        }
        if ( sla_type == 1) {
            table.api().column(4).visible(false);
        } else {
            table.api().column(4).visible(true); 
        }
        // 核心实现：不能放到initComplete方法里，因为表格重载后跳转功能会消失
        if (table.api().page.info().pages > 1) {
            $("#dynamic-table_info").append('<div class="jump-page">跳到 <input type="number" id="jump_page" min="1"> 页</div>');
        }
    },
    "initComplete": function(settings, json) {
        if ($('body').height() < document.documentElement.clientHeight) {
            $('footer').css('position','fixed');
        } else {
            $('footer').css('position','static');
        }
        $('.adv-table input[type="search"]').addClass('form-control');
    },
    "rowCallback": function(row, data) {
        $('td:eq(0)', row).attr('title', '角色权限：' + data[11]);
    },
});

// datatables跳转到指定页
$("body").delegate('#jump_page', 'keyup', function(event) {
    var page = Number($(this).val());
    if (event.keyCode == 13 && page > 0) {
        table.api().page(page - 1).draw(false);
    }     
});