JQuery/Bootpag分页点击切换页面后不回到结果顶部如何解决？

云原生阿岚

2026-10-3

Bootpag分页跳转后自动滚动到结果顶部的修改方案

你只需要给load()方法添加加载完成的回调函数，在回调中执行滚动逻辑即可，修改后的完整JS代码如下：

$(document).ready(function() {
    $("#results").load("fetchpages.php");  //initial page number to load
    $(".pagination").bootpag({
       total: <?php echo $pages; ?>,
       page: 1,
       maxVisible: 5 
    }).on("page", function(e, num){
        e.preventDefault();
        $("#results").prepend('<div class="loading-indication"><img src="img/ajax-loader.gif" /> Loading...</div>');
        // 新增回调函数，数据加载完成后执行滚动
        $("#results").load("fetchpages.php", {'page':num}, function() {
            // 滚动到结果列表顶部，适配大多数场景
            $('html, body').scrollTop($("#results").offset().top);
            
            // 如需平滑滚动，注释上一行，使用下方代码即可
            // $('html, body').animate({
            //     scrollTop: $("#results").offset().top
            // }, 250);
        });
    });
});