javascript - jQuery 按钮样式仅应用于 Datatable 第一页中的按钮

Question

我试图在互联网上搜索类似的问题，但我不知道如何表达。

我有一个 Datatable在多个页面上显示数据。在每一行中，我都有一个带有“opt”类的按钮。然后在文档就绪函数中，我使用以下代码初始化按钮:

$(function() {
    $( ".opt" ).button({
      icons: {
        primary: "ui-icon-gear",
        secondary: "ui-icon-triangle-1-s"
      },
      text: false
    });
});

但是，当我加载页面时，此 jQuery 样式仅应用于第一页上的按钮。另一页上的按钮显示为普通按钮。感谢您的任何建议。

Answer 1

是的，就像我上面提到的那样。

// Re-draws the table on update.
table.draw();

是当表有变化时触发的函数。

您想要做的是遵循 harco 的建议。您需要添加如下代码片段，我的示例将使用 Jquery。

// On every pagination click
// paginate_button is a class given to the pagination buttons in the datatable.
$('.paginate_button').click(function(){

   // You might have to add a setTimeout function 
   // here to make sure the datatable is done loading.

   $( ".opt" ).button({
      icons: {
        primary: "ui-icon-gear",
        secondary: "ui-icon-triangle-1-s"
      },
      text: false
    });
});

关于数据表事件的信息 http://www.datatables.net/manual/events

这是您应该尝试的，如数据表页面所示。​​

var table = $('#example').DataTable();

table.on( 'draw', function () {
    // your code here
} );

这将做的是在重新绘制的更新数据表上设置您的函数。

希望这是一个很好的例子和解释