为什么jQuery会让我的页面在点击后跳回到顶部？

Question

我有一个关于jQuery的一般问题.

我创建了几个jQuery按钮,但我遇到的问题是当你向下滚动页面的一半而你按下按钮时,页面跳回到顶部,而不是停留在按钮位置的中间？

你怎么能阻止这种情况发生,因为这对用户来说是令人沮丧的？

这有什么特别的原因吗？

jsFiddle示例:

$(".comment-here").click(function() {
   $(".comment-form").slideToggle('slow');
});

$(".main-btn.orange").click(function(){
   $(".comment-form").slideUp('slow');
});

Answer 1

您没有阻止默认事件.由于您单击了锚标记,因此默认事件#只是跳到文档的顶部.

为了防止这种情况发生:

将事件传递给函数,并使用preventDefault();

$(".comment-here").click(function(e){
    e.preventDefault();
    $(".comment-form").slideToggle('slow');
})

$(".main-btn.orange").click(function(e){
    e.preventDefault();
    $(".comment-form").slideUp('slow');
})

您也可以使用return false;,而不仅仅是阻止默认事件,它会将事件停止bubbling到parent元素.