Turbolinks 和 Scrollspy

Question

我已经关注 this tutorial 复制了 boostrap 文档中的侧边菜单。

一切似乎都很好，但是一旦从子菜单中单击锚标记，当前子菜单就会崩溃。滚动到下一个子菜单部分将打开子菜单备份，它会再次正常工作。但是，滚动回单击的锚标记会再次折叠子菜单。

我已确认关闭 turbolink 可以解决此问题，但我希望在保留 turbolink 的同时解决此问题。

Answer 1

很遗憾，我无法重现您遇到的行为，所以如果您有一个可以分享的示例，那将会有所帮助。

您可能遇到了 Turbolinks 处理同一页面锚点的方式的错误。它当前重新加载页面，然后滚动到元素，而不仅仅是滚动到元素。此错误已在 Turbolinks 存储库中记录：https://github.com/turbolinks/turbolinks/issues/75。一种可能的解决方案是防止 Turbolinks 在同页锚点点击时重新加载页面：

$(document).on('turbolinks:click', function (event) {
  if (event.target.getAttribute('href').charAt(0) === '#') {
    return event.preventDefault()
  }
})

轻微的缺点是这可能会导致返回按钮问题。否则，您可能希望在页面加载后尝试在相关选择上调用 .scrollspy('refresh')（请参阅：http://getbootstrap.com/javascript/#scrollspy-methods）。