防止页面跳转的onclick事件

Question

如何防止我的onclick链接导致页面跳转到顶部，有什么最好的方法？

<a name="point1">
<a href="#point1" onclick="blahblah">

<a href="javascript:" onclick="blahblah">

<a href="javascript:null;" onclick="blahblah">

还是其他什么？

- ian

---

我知道这不完全是你要求的，但你可以不使用 'onclick'。示例：<a href="javascript: fooBar()">FOO</a> - MataMix

Answer 1

我总是使用

<a href="javascript:void(0)" onclick="blahblah">

- Gordon Tucker

---

对我来说没问题！Return false; 不知道为什么不起作用，但这个方法可以解决问题。谢谢。 - Chuck Le Butt

完美运行！我来这里只是为了找到这个答案。 - DirtyBirdNJ

在我看来，这并不是HTML5友好的。 - andrei

为什么不是@andrei？只是好奇。 - Lucas Healy

@LucasHealy 对不起，我说这句话时脑海中没有任何想法，这条评论已经有将近5年的历史了。答案很好。 - andrei

Answer 2

在“onclick”中返回false可以防止页面跳转。

<a href="#" onclick="someFunction(); return false;">blah</a>

- Vertigo

---

现在尝试使用以下代码：onClick="submitComment('+[id]+'); this.onclick=null; return false; 但它不起作用。 - ian

奇怪。返回false应该防止默认的链接操作。如果您尝试仅使用onclick ='return false;'，它是否有效？ - Vertigo

尝试将 onClick 更改为 onclick。根据 MIME 类型，onClick 和 onclick 可以被解释为两个不同的属性。 - Xavi

如果你正在使用 onClick="submitComment('+[id]+'); this.onclick=null; return false;，那么为什么 return false 失效就很明显了——你将 onclick 属性设置为 null，我认为这会立即停止执行。不过我没有测试过。 - artlung

Answer 3

试试这个：

<a href="#" onclick="func(); return false;">link</a>

请注意，onclick参数返回false。返回false会取消默认浏览器行为。在锚点标签的情况下，默认浏览器行为是跳转到#锚点（也称页面顶部）。

通过相同的技巧，您还可以使图像不可拖动，并确保链接不会夺取用户的焦点：

<img src="coolios.jpg" onmousedown="return false" /> <!-- un-draggable image -->
<a href="stuff.html" onmousedown="return false">link that doesn't steal focus</a>

- Xavi

Answer 4

也许这样就可以了吧？

<a href="javascript: return false;" onclick="blahblah">

- Michal M