Question

我有这段代码：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.14/jquery-ui.min.js</script>    

<script>
$(function() {
    $('a.scrollToTop, a[href=#top]').click(function(){
    $('html,body').animate({scrollTop:0}, 1500);
    return false;
    })
});
</script>

和正文中的这段代码：

<a name="top"></a>
<p><a href="#top">Back to the Top</a></p>

但它不起作用。谁知道为什么会这样？我环顾四周但找不到解决方案。

感谢。

Answer 1

使用以下内容：

$(function() {
    $('a.scrollToTop, a[href=#top]').click(function(e){
        e.preventDefault();
        $('html,body').animate({scrollTop:0}, 1500);
        return false;
    });
});

您需要在})行之后将});更改为return false;。而且，由于您正在查找<a>的点击，请使用preventDefault()。

Answer 2

为您的标签添加ID

<p>
    <a href="#top" id="scrollTop">Back to the Top</a>
</p>



$('#scrollTop').click(function(){ 
    $('html,body').animate({ scrollTop: 0 }, 'slow');
    return false; 
});

Answer 3

许多答案已经开始，但我已经开始了，所以这里是一个使用id的小提琴

http://jsfiddle.net/LRtXj/

$(function() {
    $("#top").click(function(){
        $("html, body").animate({ scrollTop: "0px" }, 1500);
        return false;
    })
});

 <p><a href="#" id="top">Back to the Top</a></p>

滚动到顶部不生效

3 个答案: