防止锚点将页面推到底部（HTML）

Question

我有一个带有style =“overflow：auto”的div，里面有一些文字。那个文本有一些锚点，我有div的左边的链接（不在div中），每次我点击进入一个锚点，页面都会到达底部，就像锚点位于页面底部一样。

有没有办法防止这种情况发生？

<a href='#id2'>Link</a>
<div style='width: 100px; overflow: auto;'>
Text Inside, Big text with <hr id='#id10' /> here
Text Inside, Big text with <hr id='#id5' /> here
Text Inside, Big text with <hr id='#id6' /> here
Text Inside, Big text with <hr id='#id27' /> here
Text Inside, Big text with <hr id='#id24' /> here
Text Inside, Big text with <hr id='#id20' /> here
Text Inside, Big text with <hr id='#id21' /> here
Text Inside, Big text with <hr id='#id23' /> here
Text Inside, Big text with <hr id='#id22' /> here
Text Inside, Big text with <hr id='#id2' /> here
<div>

编辑：我既不使用Javascript也不使用Iframes

编辑：在Firefox 3中测试

Answer 1

听起来我发现所有正在发生的事情是它试图将你的锚点放到页面顶部的浏览器，这是在这种情况下的正常行为。所以它不是滚动到底部，而是试图让你的链接到页面顶部，但在它到达之前击中滚动条的底部。

虽然一些示例代码会有所帮助。

Answer 2

每页只能有一个id（id2，id3，id4等）你已经列出了10次id2，这很可能导致你的链接中断。此外，您无法以井号开始id;有效ID以（[​​A-Za-z]）开头。

Answer 3

这是浏览器的本机功能。如果你想在不使用javascript的情况下破坏它，那么你不妨用水枪充电，因为你不会非常成功。

使用像jQuery这样的简单框架可能会在几行代码中清除这一点。您可以将元素滚动到视图中，并防止默认活动或锚点。