Question

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

我有一个Datatable，可以显示多个页面上的数据。在每一行中，我都有一个带有＆＃34; opt＆＃34;类的按钮。然后在文档就绪功能中，我使用以下命令初始化按钮：

$(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
} );

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

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

Answer 2

您应确保在加载每个页面后运行代码。只有在加载初始文档（带有第一页数据）时才会调用文档就绪功能。当您向数据表中添加新数据时，您应该通过类＆＃34; .opt＆＃34;来浏览所有新添加的元素。并将它们变成带样式的按钮。

Datatable插件有一个event，在重绘表后触发。您应该再次使用它来设置按钮的样式。

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

// Document ready
$(function() {
  initButtons();
});

// Assuming "table" is the variable name of your datatable
table.on('draw', initButtons);

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

2 个答案: