Question

我的问题如下：在我的网站上，我希望我的锚链接能够顺利滚动到它们链接到的ID。有许多线程可以解决这个问题，但是我只能在jsfiddle示例项目https://jsfiddle.net/7fcvkwf0/16/

上使用它们。

$("a").each(function(index, element){
    $(this).click(function(e) {
        if (this.hash != "" && $(this).attr("href").charAt(0)=="#"){
            e.preventDefault();
            var id = $(this).attr("href");
            $('html, body').animate(
                {scrollTop: $(id).offset().top},
                1000,
                "swing",
                function(){
                console.log("done");
            });
            window.location.hash = id;
        }
    });
});

是我用来使动画流畅的功能。我不知道为什么，但我在我自己的主页上使用完全相同的代码，但它似乎不起作用，因为它立即跳转到锚链接。控制台日志在1000毫秒（1秒）后出现。不幸的是我不能告诉你这个问题，因为我无法在jsfiddle中重现它（我不知道为什么）。

Answer 1

这可能会有所帮助。我认为这与事件绑定的内容有关。特别是对我来说，我有异步页面加载，该页面基本上是动态添加锚的，因此，将阻止添加到dom后，prevent不会绑定到动态加载的元素。

$(document).on('click', 'a', function(e) {
    if (this.hash !== "") {
      e.preventDefault();
      var hash = this.hash;
      $('html, body').animate({
        scrollTop: $(hash).offset().top-150
      }, 500);
    }

}）;

从另一个线程...

事件不会与动态添加的元素绑定，除非您使用on（）将其委托给父元素或文档。您必须使用不同形式的on进行事件委派。

Original post 这对我有用，尽管由于我不知道的原因它杀死了附加的哈希。但滚动条可以始终如一地工作。

为什么JQuery的动画功能会跳转到我的锚链接？

1 个答案: