jquery 如何捕获DataTables的下一页/上一页分页按钮上的事件

gcuhipw9  于 12个月前  发布在  jQuery
关注(0)|答案(2)|浏览(139)

有没有人能给我一个例子,说明如何捕捉数据表的下一页/上一页分页按钮上的事件?特别是我对“下一页”按钮感兴趣。如果你有一个例子,说明如何捕捉特定分页按钮的事件,这将对我很有帮助。
我在datatable中搜索了和,发现要捕获事件,应该使用以下命令:

$('#example').on('page.dt', function ()).DataTable();

字符串
但是这捕获了所有分页按钮的事件。我想知道如何为一个特定的按钮(在我的例子中是“next”)做这件事。
Thanks in advance

bgibtngc

bgibtngc1#

使用下面的代码将click事件处理程序附加到“Next”分页按钮。

var table = $('#example').DataTable({
   drawCallback: function(){
      $('.paginate_button.next:not(.disabled)', this.api().table().container())          
         .on('click', function(){
            alert('next');
         });       
   }
});

字符串
代码和演示请参见this jsFiddle

e5nszbig

e5nszbig2#

drawCallback: function () {
    var table = this.api();
    var pageInfo = table.page.info();

    $('.paginate_button.next:not(.disabled)', table.table().container())
        .on('click', function () {
            var nextPageIndex = pageInfo.page ;
            alert('Next page index: ' + nextPageIndex);
        });

    // Event handler for page number buttons
    $('.paginate_button:not(.next, .previous)', table.table().container())
        .on('click', function () {
            var clickedPageIndex = $(this).text() - 1; // Adjust to zero-based index
            alert('Clicked page index: ' + clickedPageIndex);
        });

    // Event handler for the "Previous" button
    $('.paginate_button.previous:not(.disabled)', table.table().container())
        .on('click', function () {
            var previousPageIndex = pageInfo.page - 1;
            alert('Previous page index: ' + previousPageIndex);
        });
},

字符串

相关问题