Question

我想在没有数据时禁用分页按钮。即，当用户在最后一页中看到数据时，该表将最后一个按钮与第一页相同，前一页和下一页相应。

我有以下代码

$('#data_table').dataTable( {
                "aaData": dataSet,
                "aaSorting": [[0,'asc'],[0,'desc'],[2,'asc'],[2,'desc'],[3,'asc'],[3,'desc'],[4,'asc'],[4,'desc'],[5,'asc'],[5,'desc'],[6,'asc'],[6,'desc'],[7,'asc'],[7,'desc']],
                "iDisplayLength": 4,                
                "bInfo": true,
                "bLengthChange": false,
                "bPaginate": true,
                "bAutoWidth": false,
                "sPaginationType": "full_numbers",
                "bAutoWidth": true
})

我已经完成了分页部分的工作，但是当我看到最后一页数据时，我仍然可以点击最后一个按钮，如果我看到第一页数据，我仍然可以点击第一个按钮。如果我们在第一页或最后一页，则禁用按钮。

Answer 1

添加

.paginate_button_disabled {display: none; }

到CSS。这仅适用于“full_numbers”版本的分页。

Answer 2

.dataTable（）函数是否在第一个和最后一个按钮中添加了CSS类？使用Firebug找出答案。

如果是这样，只需使用CSS。

a.last-disabled { display: none; }

或jQuery和CSS：

$('a.last-disabled').css('color', '#ccc'); // grey out
$('a.last-disabled').click(function() { return false; });

Answer 3

嗯，你可以通过CSS隐藏它们。我想。

.dataTables_paginate .ui-state-disabled {
     display:none;
}

如果您在jsfiddle.net上提供示例，那么可以帮助您更好地

禁用没有数据的数据表中的按钮

3 个答案: