python - Flask - href 锚定在不同的页面(导航栏)

Question

我正在使用 Flask 开发网络应用程序。在主页 (index.html) 上，导航栏使用 anchor 将一个导航到页面上的特定部分:

<a class='text' href='#body2'>calculate</a>

<a id="body2"></a>

在主页上，有一个将您链接到新页面 (output.html) 的表单。我想要相同的导航栏将用户导航到上一页 (index.html) 和特定部分。我在第二页写了导航链接，如下所示:

<a class='text' href="{{ url_for('index') }}#body2">calculate</a>

当我点击导航链接时，新页面没有加载。然而，这很奇怪，当我检查浏览器中的导航链接元素并通过检查客户端单击链接时，它确实将我带到了正确的页面/部分。

如果我从上面的行中删除“#body2”，它会成功导航到上一页，但不会导航到特定部分。

(如果您想实际试用 Web 应用程序上的导航链接，请使用以下链接: http://yourgreenhome.appspot.com/ - 在空白表格条目中输入一些随机值，它将带您到第二页。它通过 Google 的 App Engine 运行，但这绝对不是导致问题的原因，因为当我在本地主机上运行该网站时，问题仍然存在。

Answer 1

你在 smoothscroll.js 中有错误

$(document).ready(function(){
  $("a").on('click', function(event) {
    if (this.hash !== "") {
      event.preventDefault();

      var hash = this.hash;


      $('html, body').animate({
        scrollTop: $(hash).offset().top
      }, 800, function(){

        window.location.hash = hash;
      });
    }
  });
});

在advpy页面中，$(hash).offset()未定义，因此top未定义。因为您要阻止默认事件 (event.preventDefault();)，所以不会发生对链接的点击。