Question

我正在使用的jquery＆＃34;软滚动＆＃34;点击链接时页面下方似乎打破了页面上的所有链接。我刚刚注意到了为什么要开发这个网站。这是我的jquery。

/*-------------------
ANIMATION SCROLLING TO CATEGORYS ON PAGE
---------------------*/
var $root = $('html, body')

$(document).on('click', 'a', function (event) {
    event.preventDefault();
    $root.animate({
        scrollTop: $($.attr(this, 'href')).offset().top
    }, 750);
    return false;
});

如果我删除此代码，网站上的所有内容都可以正常运行。

当我重新输入此代码时，软滚动会对页面上的锚点起作用，但会破坏页面上的所有链接。是否是我网站上的相关链接或外部链接。点击页面上的任何链接都不会做任何事情，就像没有连接链接一样。

有谁知道为什么这会导致我的所有链接无效？

更新

我让我的工作是改变我的内部链接并为他们添加一个类。

<a href="#cats" class="internal">

然后将javascript更改为

$(document).on('click', 'a.internal', function (event)

我的原始代码取消了页面上所有链接的所有默认行为。感谢GentlemanMax

更新了答案

Answer 1

当您执行以下操作时，您将绑定到页面上的每个链接：

$(document).on('click, 'a', function(event){...

您说的是＆＃34;当有人点击文档中的任何a标记时，请执行此操作。由于回调的第一行是event.preventDefault()，因此会阻止默认的链接行为。您需要过滤事件绑定，以防止内部链接上出现正常的链接行为。

如果可能，您最好的选择是在内部链接中添加一个类，以便您可以将功能更改为此类

$(document).on('click', 'a.internal-page`, function(event){...

如果不是这种可能性，您可以在点击的链接的href属性上执行一些逻辑，以在调用event.preventDefault()之前确认它是内部的。

Jquery脚本软键滚动到锚点打破页面上的链接

更新

1 个答案: