javascript - DataTables.net 中损坏的分页按钮

Question

我正在尝试使用 js 数组的 DataTables 的基本示例。

http://dl.dropbox.com/u/464119/Misc/Stack%20Exchange/html/table.html

一切都渲染得很好，除了右下角的分页按钮。我尝试手动修复他们的 css，但是当重新绘制表格（分页/# 行更改）时，它又被搞砸了。

知道如何让上一个/下一个按钮呈现正常吗？

Answer 1

修复它的一种方法是在每次表格更改时重新应用固定的 CSS：

$('#example').on("draw", function() {
    //Change the CSS here
});

这样，每次“绘制”表格（排序，页面更改，过滤器等）时都会修复它

但这并不能解决它首先被破坏的问题。如果我发现了什么，我会更新我的答案。

Answer 2

如果您不想要上一个/下一个文本，您可以使用下面的 oLanguage 属性将其删除

$('#example').dataTable( {
    "oLanguage": { "oPaginate": {"sNext": "","sPrevious": ""}},
    "aaData": //rest fo your code.....

否则，下载并添加这个 css

<link rel="stylesheet" type="text/css" href="http://datatables.net/release-datatables/media/css/demo_table.css">

添加与上面相同的olanguage属性，文本更短

"oLanguage": { "oPaginate": {"sNext": "Next","sPrevious": "Prev"}},

并修改第 71 行 demo_table.css 上方 css 中的 dataTables_paginate 类以减小文本的字体大小

.dataTables_paginate {
    float: right;    
    text-align: right;
    font-size: 12px;
}

希望这可以帮助..