为什么执行我的jQuery事件处理程序会导致页面滚动回到顶部？

Question

我正在我的页面上运行一些JavaScript.每当它捕获附加到锚<a>元素并执行处理程序(我使用jQuery附加)的事件时,滚动位置将重置回页面顶部.有解决方案吗？

Answer 1

<a>如果您将href属性保留为#滚动内容,则会处理对标记的点击.这是因为浏览器在事件链的末尾执行默认操作(这是因为所谓的事件冒泡)

要解决此问题,您必须阻止浏览器对click事件的默认处理,这可以通过不同方式完成:

• 替换href='#'为href='javascript:void(0)'
• false从事件处理函数返回.
• 使用jQuery的preventDefault方法

Answer 2

一个原因可能是您有指向"#"的链接,并且您有绑定到这些链接的事件.解决方案是return false;在事件函数结束时执行:

<a href="#" id="foo">Test</a>

在jQuery中:

$('#foo').click(function() {
    /* do stuff */
    return false;
});