在同一窗口（标签）中打开链接之前，请先转到页面顶部。 如何？

Question

单击链接然后在同一选项卡中打开链接时，我想转到页面顶部

我尝试使用此代码，但是我仅转到页面顶部，并且链接未打开

这是我的JS

$(document).ready(function(){
$('.scrollToTop').click(function(){
        $('html, body').animate({scrollTop : 0},1800);
        return false;
    });
});

这是我的HTML链接

<a href="./current_page?page=5" class="scrollToTop">&gt;</a>

请帮忙）

Answer 1

尝试这个

$(document).ready(function(){
    $('.scrollToTop').click(function(){
        const url = $(this).attr('href');
        $('html, body').animate({scrollTop : 0}, 1800, function() {
            window.open(url);
        });
        return false;
    });
});

Answer 2

实现此目的的一种方法是在滚动到顶部动画之后，通过JavaScript执行页面导航。

这可以通过在.promise().done( .. )回调期间浏览浏览器来完成，在该回调中，您将location更新为单击链接的href：

 $(document).ready(function() { $('.scrollToTop').click(function() { /* Obtain href from clicked link element */ const href = $(this).attr('href'); $('html, body').animate({ scrollTop: 0 }, 1800) .promise() .done(function() { /* After animation complete, navigate to link's href */ location = href; console.log(`Navigate: ${href} (won't work in stack overflow sandbox)`); }); return false; }); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script> <h1>Scroll past</h1> <h1>Scroll past</h1> <h1>Scroll past</h1> <h1>Scroll past</h1> <a href="./current_page?page=5" class="scrollToTop">Scroll to top, then navigate &gt;</a> 

Answer 3

由于您的click事件返回false ，因此您锚点的href标记将不会重定向。

请注意，由于您正在更改通过锚点的路线，因此加载的页面将始终从正文的顶部开始。