使用JS在一页网站上平滑滚动特定链接

Question

我正在尝试从Nav平滑滚动到容器ID，并且页面正在滚动。但是，我有一个引导“列表组”，它也在容器中使用href和id。当我单击列表组中的href时，它会平滑滚动并发出错误。有没有一种方法可以平滑滚动特定ID（仅适用于导航）并阻止列表组对JS做出反应？

我已经尝试过了，但似乎没有用smooth scroll to div with jquery

尝试html { scroll-behavior: smooth;}，但并非在所有浏览器上都兼容

使用此代码，它可以正常工作，但会出错how css smooth scroll jquery

链接为该网站的index.html，正文为.js：index.html

感谢您的帮助

Answer 1

有两种方法可以避免在列表组以外的链接上触发平滑滚动。

1）通过将此功能仅应用于导航建议的路线：

$('a.nav-link').on('click', function(event) {
    ...
})

2）应用于所有链接，不包括列表组项：

$('a').not('[data-toggle]').on('click', function(event) {
    ...
})