JQuery/Bootpag分页没有将下一页返回到结果的顶部

Question

我已经在我的网站上实现了JQuery/Bootpeg分页。它的工作原理非常好，除了一件事:当您单击移动到一个新页面时，新的结果集将被加载，但是页面仍然位于新的结果集的底部，其中有分页按钮。这意味着viistor必须回滚到页面的顶部，以向下滚动新结果，我认为这有点笨重(我每页显示20个结果)。

这里是我正在使用的HTML和JS编码。我还有一个PHP脚本，它从我的数据库中提取数据并显示出来(fetchpages.php)。是否有任何方式可以对代码进行调整，以便页面从新结果的顶部(页面顶部或页面上的锚点)重新显示？

​

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

});

<script type="text/javascript" src="scripts/jquery-1.11.0.js"></script>
<script type="text/javascript" src="scripts/jquery.bootpag.min.js"></script>
<div id="results"></div>
<div class="pagination"></div>

​

Answer 1

JQuery:

$(窗口).scrollTop(0)；//使用它将页面设置为顶部

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

        $(window).scrollTop(0); // use this to set page back to top
    });

});