如何在没有整个浏览器跳转的情况下在可滚动div中锚定标记？

Question

我正在构建一个简单的词汇表小部件，作为客户端大型项目的一部分。术语表的内容包含在可滚动的div中（overflow：auto）。每个字母都有一个与之关联的锚标记（＃a，＃b，＃c等）。可滚动div上方是一个包含字母表中每个字母的div。单击其中一个字母会将用户缩小到可滚动div中该字母的定义。这是有效的，但是一个意想不到的副作用是整个窗口跳转到锚点，这会让用户感到困惑和烦恼。

这是小部件，稍微拆了一下，并带了一堆<br />来让你明白我的意思。

http://www.nitrohandsome.com/clients/topics/glossary-widget/

我尝试了一些不同的javascript想法，我从一些谷歌搜索拼凑而成，但没有任何工作，所以我除了实际去锚代码（我是一个相当大的JS新手），除了一切。所以现在，点击任何一个字母都会执行这个javascript函数，并将锚标记传递给它：

    function jumpToAnchor(myAnchor) {
   window.location = String(window.location).replace(/\#.*$/, "") + myAnchor;
  }

如何将其关闭，以便每次单击链接时整个窗口不会跳转？

提前致谢！

Answer 1

如果你正在使用jQuery，你可以试试scrollTo插件。此外，要仅编辑哈希部分或URL，您只需执行

function jumpToAnchor(myAnchor) {
   window.location.hash = myAnchor;
}

Answer 2

尝试使用IFrame代替Div或使用ScrollBy创建特定功能。