防止锚点将页面推到底部 (HTML)
我有一个 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，也不使用 Iframe
编辑：在 Firefox 3 中测试
I have a div with style="overflow: auto" with some text in it. That text has some anchors, which I have links left of the div (not within the div) and everytime I click to go to an anchor, th page goes to the bottom, like the anchor was in the bottom of the page.
Is there any way to prevent this from happening?
<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>
EDIT: I'm nor using Javascript neither Iframes
EDIT: Tested in Firefox 3
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
这是浏览器的本机功能。 如果你想在不使用 JavaScript 的情况下破坏它，那么你还不如用水枪冲锋，因为你不会很成功。
使用像 jQuery 这样的简单框架可能只需几行代码就可以解决这个问题。 您可以将元素滚动到视图中，并阻止默认活动或锚点。
This is the browsers native functionality. If you want to disrupt it without using javascript, then you might as well charge hell with a water pistol because you're not going to be very successful.
Using a simple framework like jQuery would likely clear this up in just a couple lines of code. You could scroll elements into view, and prevent default activity or anchors.
在我看来，所发生的一切都是浏览器试图将您的锚定到页面顶部，这是这种情况下的正常行为。 因此，它并不是滚动到底部，而是试图将链接带到页面顶部，而是在到达那里之前点击滚动条的底部。
不过，一些示例代码会有帮助。
It sounds to me like all that is happening is that the browser it trying to take your anchor to the top of the page, which is it's normal behavior in this situation. So it's not scrolling to the bottom so much as trying to get your link to the top of the page but hitting the bottom of the scroll bar before it gets there.
Some example code would be helpful though.
每页只能有一个
id（id2、id3、id4 等）。id2 已列出 10 次，这很可能会导致链接中断。 另外，id不能以井号开头； 有效 ID 以 ([A-Za-z]) 开头。You can only have one
idper page (id2, id3, id4, etc.) You've got id2 listed 10 times which is most likely causing your link to break. Also, you cannot startids with a pound sign; valid IDs start with ([A-Za-z]).