Javascript 返回顶部按钮没有'；t单击-jquery

我试图通过简单的jquery实现页面上的“返回顶部”功能。“返回顶部”按钮按预期显示/消失。 当它出现时，如果我点击它，我希望它会进入页面顶部，而不是什么都没有发生。我不确定出了什么问题

代码如下：

css:

html:

注意：如果我在$（window）.scroll（）中调用click函数，我可以单击该按钮。但它会闪烁，不适合调整窗口大小。

$(document).ready(function(){
        $(window).scroll(function(){
            if($(window).scrollTop() > 0){
                $("#btoTop").fadeIn("slow");
            }
            else {
                $("#btoTop").fadeOut("slow");
            }
            $("#btoTop").click(function(event){
              event.preventDefault();
              $("html, body").animate({scrollTop:0 },"slow");
            });
        });

});

---

您正在绑定

每次滚动时都要单击按钮上的

，这是不必要的。您应该更改它：

$(document).ready(function () {

  $(window).scroll(function () {

    if( $(window).scrollTop() > 0 ) {

      $("#btoTop").fadeIn("slow");

    } else { 

      $("#btoTop").fadeOut("slow");
    }
  });

  // Bound a single time
  $("#btoTop").click(function ( event ) {

    event.preventDefault();
    console.log("Clicked the button");
    $("html, body").animate({scrollTop:0 },"slow");

  });
});

---

这可能不是问题所在，但应该进行更改以避免代码中出现奇怪的行为。

当我试图单击按钮时，我发现该按钮在DOM中还不可用。 在上面加一个定时器效果很好。希望这能帮助有类似问题的人

$(document).ready(function(){
            $(window).scroll(function(){
                if($(window).scrollTop() > 0){
                    $("#btoTop").fadeIn("slow");
                }
                else {
                    $("#btoTop").fadeOut("slow");
                }
            });
            $timeout( function() {
                $("#btoTop").click(function(event){
                    event.preventDefault();
                    $("html, body").animate({scrollTop:0 },"slow");
                });
            }, 500);
});

---

你的代码在这里工作：指定像素不起作用。由于某些奇怪的原因，没有调用单击。哇……当我在应用程序中使用完全相同的代码时，为什么它不起作用：-（我知道。由于按钮的单一绑定不起作用，我尝试在滚动中使用click功能。如果我按照您提到的方式操作，则不会调用click，这正是我的想法。）problem@SAM您没有看到“单击按钮”在开发工具中，当您单击它时？如果没有，那么页面上的其他地方会出现问题。是的！我没有看到警报出现。如果我在警报上放置断点，调试器甚至无法到达它。@SAM页面上还有其他脚本吗？是的……页面上还有很多其他内容。我想我需要深入研究，看看是什么阻止了警报但是，我怀疑这是否是罪魁祸首…$（'body'）。在（'click'，函数（e）{…}上，它是在超时函数中调用的。不过我不确定。

$(document).ready(function(){
        $(window).scroll(function(){
            if($(window).scrollTop() > 0){
                $("#btoTop").fadeIn("slow");
            }
            else {
                $("#btoTop").fadeOut("slow");
            }
            $("#btoTop").click(function(event){
              event.preventDefault();
              $("html, body").animate({scrollTop:0 },"slow");
            });
        });

});

$(document).ready(function () {

  $(window).scroll(function () {

    if( $(window).scrollTop() > 0 ) {

      $("#btoTop").fadeIn("slow");

    } else { 

      $("#btoTop").fadeOut("slow");
    }
  });

  // Bound a single time
  $("#btoTop").click(function ( event ) {

    event.preventDefault();
    console.log("Clicked the button");
    $("html, body").animate({scrollTop:0 },"slow");

  });
});

$(document).ready(function(){
            $(window).scroll(function(){
                if($(window).scrollTop() > 0){
                    $("#btoTop").fadeIn("slow");
                }
                else {
                    $("#btoTop").fadeOut("slow");
                }
            });
            $timeout( function() {
                $("#btoTop").click(function(event){
                    event.preventDefault();
                    $("html, body").animate({scrollTop:0 },"slow");
                });
            }, 500);
});