为什么带有 # 的链接在 Firefox 和 safari 中不起作用？答案

【问题标题】：Why does do links with # not work in firefox and safari?为什么带有 # 的链接在 Firefox 和 safari 中不起作用？
【发布时间】：2017-09-13 03:09:29
【问题描述】：

我目前正在编写一个网站作为学校项目的脚本。我的想法是将整个内容加载到一个文件中，但是如果您单击导航中的链接，则只会显示允许的内容。我用 javascript 做到了这一点，它对 url 做出反应，所以当我点击导航上的链接时，url 必须改变。所以我只是在href后面加了一个#：

 <nav id="nav">
      <a id="ict" href="index.html#ict" onclick="refresher();" >Informatik</a>
      <a id="mmt" href="index.html#mmt" onclick="refresher();" >Multimediatechnik</a>
      <a id="gundd" href="index.html#gundd" onclick="refresher();" >Gestaltung und Design</a>
      <a id="daw" href="index.html#daw" onclick="refresher();" >Digital Artwork Gallery</a>
      <a id="about" href="index.html#about" onclick="refresher();" >&Uuml;ber mich</a>
  </nav>

这在 Google Chrome 和 Micrisoft Edge 上运行良好，但如果您使用 firefox 或 safari，url 中的 # 不会改变。

我不认为 JS 是这里的问题，但我不是 100% 确定，所以这里是 onclick_function：

function refresher(){
    location.reload()
}

感谢您的帮助！

【问题讨论】：

按照您的设置方式，我不确定您为什么要使用 location.reload。你不应该只是显示/隐藏内容吗？内容已经在页面上，无需重新加载，只需呈现即可。
但我还能如何让 js 重新加载？现在看起来像这样：document.getElementById('daw_gal').style.display = "block";但除非重新加载 js，否则这不会发生。我说得对吗？ @凯文
js 不需要重新加载。您只需运行需要在您正在调用的函数中运行的代码。
现在我明白你在说什么，我会试着告诉你它是否有效。谢谢！

标签： javascript jquery html css firefox

【解决方案1】：

他们确实有效。但是，在他们正确滚动页面后，refresher 运行并将页面滚动到-300。确定您想要的行为（href 或 refresher 函数）并使用其中之一，但不能同时使用。

【讨论】：

谢谢。我用scrollTop删除了部分，但我仍然有问题，url在firefox中没有改变，但在chrome中却有。我不能删除整个函数，因为我需要它来重新加载 js，所以我不需要的所有容器都得到一个 display:none
@NicolasLang 不，这不仅仅是关于scrollTop 的单行，您需要删除整个onclick 和相关功能或href，因为两者正在互相争斗。你不能两者兼得。为什么需要刷新页面？
@NicolasLang 我认为您真正的问题是您对更大问题的解决方案是错误的方法。您说了一些关于确保元素不会以display:none 结尾的内容，但重新加载页面并不是确保这一点的唯一方法。您应该编辑您的问题并解释您正在处理的更大场景。