0

我注意到，如果我多次单击“返回顶部”按钮，然后您尝试向下滚动，它会导致窗口继续滚动回到顶部。知道如何阻止这种情况发生吗？

我的代码是：

<a href="#" class="scrollup">Scroll</a>

<script type="text/javascript">
    $(document).ready(function(){ 

        $(window).scroll(function(){
    $("html, body").stop();
            if ($(this).scrollTop() > 100) {
                $('.scrollup').fadeIn();
            } else {
                $('.scrollup').fadeOut();
            }
        }); 
        $.clicked = false;
        if ($.clicked == false){
        $('.scrollup').click(function(){
        $.clicked = true;
            $("html, body").stop().animate({ scrollTop: 0 }, 600);
            return false;
        });
       }
    });
</script>
4

3 回答 3

1

正如您所说，您单击多次，因此事件将被触发多次，因此您需要停止动画功能，

所以编辑你的代码如下，

$("html, body").stop().animate(
 --------------^^^^^^^^----

或编辑滚动代码

$(window).scroll(function(){
  $("html, body").stop();
于 2013-09-06T06:42:54.470 回答
0 
$(function() {
        $('button').hide();
        $(window).scroll(function() {
            if ($(this).scrollTop() >= 50) { // If page is scrolled more than 50px
                $('#return-to-top').fadeIn(200); // Fade in the arrow
            } else {
                $('#return-to-top').fadeOut(200); // Else fade out the arrow
            }
        });
        $('#return-to-top').click(function() { // When arrow is clicked
            $('body,html').animate({
                scrollTop: 0 // Scroll to top of body
            }, 500);
        });
    });

This should work.

于 2014-11-28T22:51:42.273 回答
0

我有一个类似的问题。

我只是通过简单的检查解决了它：

$('.scrollup').click(function(){
    if ($(document).scrollTop() != 0) {
        $("html, body").animate({ scrollTop: 0 }, 600);
    }
    return false;
});

如前所述，问题是多次触发点击事件。因为处理事件本身对我不起作用，所以我只是尝试检查当前滚动值/位置是否已经在我想要的位置，等等：奇怪的行为消失了！:)

于 2015-01-28T13:43:56.787 回答