Javascript 使用引导时如何删除url中的#foooo？

我正在使用

bootstrap

（版本：

3.3.7

）来实现简单的导航。 这是我的代码：

标题




关于SNP。
关于SSR。

---

当我第一次来到这个页面时，Chrome（版本：

57.0.2987.110

）显示URL是

www.foofoo.org/page1

。当我点击ul a标签中包含的链接时，它会变成

www.foofoo.org/page1#SNP

或

www.foofoo.org/page1#SSR

。如何使url成为

www.foofoo.org/page1

，无论我单击哪个链接（换句话说，url总是

www.foofoo.org/page1

）。

在锚定标记中使用

数据目标

属性而不是

href

，您将能够获得相同的效果：

<ul class="nav nav-tabs nav-justified">
    <li class="active"><a data-toggle="tab" data-target="#SNP">SNP</a> </li>
    <li><a data-toggle="tab" data-target="#SSR">SSR</a> </li>
</ul>
<div class="tab-content">
    <div id="SNP" class="tab-pane fade in active">
        Something about SNP.
    </div>
    <div id="SSR" class="tab-pane fade">
        Something about SSR.
    </div>
</div>

SNP
固态继电器

关于SNP。
关于SSR。

---

这意味着您不会在地址栏中更改URL。但是，我建议将

href=“#”

保留在中，否则你的锚定标签会表现得很奇怪。

你为什么要关心这个问题？@DavidG如果我单击SSR链接，url是

www.foofoo.org/page1#SSR

。但是，url仍然是

www.foofoo.org/page#SSR

，当我刷新页面时，它的内容会转到SNP内容。：）据我所知，您希望您的URL地址在单击链接后保持不变，但网页上的内容要更改吗？如果是这样，您可能需要jQuery来处理它而不刷新页面。@encrypted21是。这就是我想要实现的。幸运的是，DavidG给出了一个很好的解决方案，它是有效的。这就是我想要实现的。非常感谢。：）

<ul class="nav nav-tabs nav-justified">
    <li class="active"><a data-toggle="tab" data-target="#SNP">SNP</a> </li>
    <li><a data-toggle="tab" data-target="#SSR">SSR</a> </li>
</ul>
<div class="tab-content">
    <div id="SNP" class="tab-pane fade in active">
        Something about SNP.
    </div>
    <div id="SSR" class="tab-pane fade">
        Something about SSR.
    </div>
</div>