没有滚动或跳转的HTML锚链接 [英] HTML anchor link with no scroll or jump

问题描述

我有各种各样的链接，都有唯一的伪锚。我希望它们影响url哈希值，并且点击魔术全部由一些mootools代码处理。然而，当我点击链接时，他们会自己滚动（或者在一个案例中顶部）。我不想滚动任何地方，但也需要我的JavaScript执行，并在URL更新中具有哈希值。

I have various links which all have unique id's that are "pseudo-anchors." I want them to affect the url hash value and the click magic is all handled by some mootools code. However, when I click on the links they scroll to themselves (or to the top in one case). I don't want to scroll anywhere, but also need my javascript to execute and to have the hash value in the url update.

模拟示例代码：

<a href="#button1" id="button1">button 1</a>
<a href="#button2" id="button2">button 2</a>
<a href="#" id="reset">Home</a>

因此，如果您点击按钮1链接，则url可以是 http://example.com/foo.php#button1

So if you were to click on the "button 1" link, the url could be http://example.com/foo.php#button1

有没有人对此有任何想法？简单地有一些JavaScript返回void杀死了滚动，但也杀死了我的JavaScript（尽管我可能用onclick解决了这个问题），但更重要的是，防止URL中的哈希值发生变化。

Does anyone have any ideas for this? Simply having some javascript return void kills the scrolling but also kills my javascript (though I could probably work around that with an onclick) but more importantly, prevents the hash value in the url to change.

解决方案

I'm probably missing something, but why not just give them different IDs?

code>< a href =＃button1id =button-1>按钮1< / a>
< a href =＃button2id =button-2>按钮2< / a>
< a href =＃id =reset>主页< / a>

<a href="#button1" id="button-1">button 1</a> <a href="#button2" id="button-2">button 2</a> <a href="#" id="reset">Home</a>

或者您喜欢的任何约定。

Or whatever convention you'd prefer.

这篇关于没有滚动或跳转的HTML锚链接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！