jQuery 数据表中的弹出窗口在页面更改后不起作用

Question

我在我的页面上使用 JQUERY Datatable 和 Webui Popover 插件。为

中的元素实际分配的弹出窗口

<small style=" color: #10336B;"  class='codedescription'  
data-title="My Title" data-content='My Dynamic Content'><b>CODE

这里是 Popover 初始化

$('.codedescription').webuiPopover({ closeable: false, trigger: 'hover', title: '', content: '', delay: { show: null, hide: 300} });

它在第一页或刚好在绑定数据表之后工作正常。但是，如果我们移动到数据表上的另一页或页面更改后，弹出窗口将停止工作。只有第一次初始化的弹出窗口有效。

所以我尝试在 Datatable 页面更改事件中重新初始化 popover 插件，如下所示。

$('#tbl_main').on('page.dt', function () {
    alert(55);
    $('.codedescription').webuiPopover({ closeable: false, trigger: 'hover', title: '', content: '', delay: { show: null, hide: 300} });
});

但是每当页面更改时都会显示警报，但弹出窗口不会显示在第一页以外的任何页面中。 JQUERY Datatable.

中的页面更改后，是什么导致弹出窗口不起作用

Answer 1

您应该使用 draw.dt 事件。 page.dt is triggered when the table's paging is updated, draw.dt 在 dataTable 完成绘制 时触发。

$('#tbl_main').on('draw.dt', function () {
   ...
});

jQuery 数据表中的弹出窗口在页面更改后不起作用

Popover inside jQuery dataTables does not work after Page changes

jquery

jquery-plugins

jquery-datatables