href="#" 导致位置地址发生变化，我们可以避免吗？答案

【问题标题】：href="#" causes location address to change, can we avoid it?href="#" 导致位置地址发生变化，我们可以避免吗？
【发布时间】：2013-08-07 11:47:34
【问题描述】：

我有许多选项卡可以处理特殊逻辑，因此不应发生位置栏地址更改。我有以下

<a href="#">Home</a>

这符合预期，即当鼠标悬停在按钮上时它会给我手鼠标指针，但单击然后开始更改路线。我希望能够阻止这种情况。

我尝试删除href或设置href=""，似乎取得了一些成功，但在悬停时却给出了意想不到的结果。

这里的最佳做法是什么？我必须删除href吗？那么我需要使用 CSS 设置选项卡的样式，以便在悬停时给我鼠标指针？如果我确实在链接中留下了href="#"，那么这会导致路由更改，这不是我想要的。

我实际上在每个选项卡的ngClick 中处理我的登录。这个逻辑不能改变路由。

有什么想法吗？

【问题讨论】：

【解决方案1】：

将href 替换为ng_click。

要获取手鼠标指针，请添加 css 样式：

a { cursor: pointer ; }
a:hover   { color: #00c }  /* user hovers     */

【讨论】：

【解决方案2】：

如果你不使用<base>标签，你可以简单地使用：

<a href="">Home</a>

确实，根据documentation：

[...]href 属性为空时阻止默认操作。

好吧，文档是错误的，真正的行为实际上是阻止href 属性等于页面位置时的默认操作。当您使用<base> 时，这是一个问题。在这种情况下，您有两种选择：

在所有情况下，您最好实际使用 CSS 来设置链接样式，因为依赖浏览器的默认行为总是一个坏主意。

【讨论】：

【解决方案3】：

尝试做：

<a href="javascript:void(0);">Home</a>

【讨论】：

谢谢，但这不是把js和html混在一起吗，我想摆脱那个……虽然如果没有别的办法？？
如果你想保留你的逻辑，那么你需要在 html 中混合一些 js。正如您已经提到的，另一个选择是删除 href 属性并将 cursor:pointer 样式应用于您的元素。
请注意：Angular 是一个严重依赖于扩展 HTML 语法的框架，所以我认为您无法摆脱将 Javascript（或 Angular 表达式）与 HTML 混合使用的问题。而且我认为在使用这种框架时这很好。这个question 提供了关于这个问题的更多见解。
谢谢，这解决了我的问题。在这里也同意迈克尔的观点。