如何创建一个不跳转的链接？

Question

有没有可能创建一个什么也不做的链接？

我希望这个项目能够成为一个链接，这样当鼠标悬停时，光标会改变，但实际上我不想让这个链接去任何地方，因为它实际上会触发在同一页上显示额外功能的 div。

- Ankur

Answer 1

将添加到浏览器历史记录:

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

不会添加到浏览器历史记录（首选方法）:

<a href="javascript:;"></a>

- leepowers

---

如果他们关闭了 JavaScript，这是否仍然可行？ - pingu

是的，它什么也不会做。 - 54 69 6D

只是提醒一下，如果您设置了onclick函数，后者会引起问题。 - Brōtsyorfuzthrāx

另外需要说明的是：href="javascript:;" 不是，也从未是首选方法。在 HTML 属性中放置 JS 代码应该尽量避免。 - Rory McCrossan

这将导航到页面顶部。 - David Schneider

Answer 2

依我之见，最完整的无作弊解决方案是：

<a href="" onclick="return false;">do absolutely nothing</a>

- pstanton

---

这个解决方案目前对我来说似乎是最好的，因为我想在 onclick 中使用 JavaScript 函数（之后我只需返回 false）：例如 <a href="" onclick="myFunction(); return false">my text</a>。 - Brōtsyorfuzthrāx

Answer 3

相反，你可以使用 <span> 元素，并设置光标样式：

<span id="node42" class="node-link">My Text</span>

在样式表中指定光标：

.node-link { cursor: pointer; }

这还可以让你稍后附加到节点进行操作（此处使用 Prototype 来展示）：

<script type="text/javascript">
    $('node42').observe('click', function(event) {
      alert('my click handler');
    });
</script>

- jheddings

---

@Roger：使用 id 可以使元素得到唯一标识，这在 JavaScript 示例中非常有用。你对于光标的观点很好。这可能更适合基于类的样式。我已经更新了我的答案。谢谢！ - jheddings

这不会导入超链接的样式（如超链接颜色、文本装饰等）。因此，powers1的答案更好。 - Pratyush

这将会对可访问性产生不良影响，因为缺乏ARIA属性或任何能够告诉屏幕阅读器这是交互元素的东西。甚至无法通过Tab导航（多次按下“Tab”键）进行访问。 - Denilson Sá Maia

Answer 4

只需将样式cursor:pointer添加到元素即可：

<a id="clickme">Click Me</a>

CSS：

#clickme { cursor: pointer }

或者（不好的情况下）内联：

<a style="cursor:pointer">Click Me</a>

- Doug Neiner

---

你必须使用 href="#". <a id="clickme">点击我</a> 会出现问题。 - Umesh Aawte

@Umesh，什么问题？唯一的“问题”是在IE6中无法使用悬停样式，而cursor: pointer不会自动应用。请解释一下。 - Doug Neiner

Answer 5

这里有两种经典的JavaScript方法，它们不会在JavaScript控制台中产生错误，也不会改变URL或将其保存到您的浏览器历史记录中：

<a href="javascript:void(0);">Click on this JavaScript error-free link that won't change your URL nor save it into your browser history</a><hr />
<a href="#void">Maybe a more readable approach, but unfortunately this one changes your URL</a>

- Mystical

Answer 6

如果你只是想要样式，可以将CSS的cursor属性设置为pointer。

但是看起来你想要的是<a href="javascript:void(do_something())">。

- Roger Pate

Answer 7

我正在寻找更简单的东西，我认为我找到了。你想让你的链接不指向任何地方吗？省略 href。 <a class='irrelevant_for_this_example'>一些文本</a> href="#" 将滚动到页面顶部。 href="javascript:;" 看起来靠不住。

对于这么简单的事情，使用 JavaScript 解决方案似乎是不必要的。

- Miguel Madero

---

实际上，我认为OP可能是在使用链接来触发JavaScript中的可折叠/可展开框。我可以确认href="javascript:;"适用于此。删除href意味着浏览器不会将其视为普通链接，即当您悬停在链接上时，鼠标不会变成手指形状。 - binaryfunt

话虽如此，href="#void"或类似的东西是可行的，而且可能更好。 - binaryfunt