jquery - 防止 .click 函数跳转到页面顶部

Question

我使用下面的代码来模拟 .animate 切换效果。但是，当点击页面时会跳转到顶部。我试过使用 prevent 但它仍然会跳，所以我想我错过了一些东西......有什么想法吗？

$(function() {
$('.menu-toggle').click(function() {
  var clicks = $(this).data('clicks');
  if (clicks) {// odd clicks 

    $(this).find('i').toggleClass('fa-bars fa-times');
    $(this).toggleClass('cross');
    $('.menu-over ul li').toggleClass('animated-fast slideInLeft')

    $(".menu-over").animate({
    left: "-50%",
    }, 1000 );

    $( ".mainsite" ).animate({
    left: "0%",
    width:"100%" ,
    }, 1000 );

  } else {// even clicks

    $(this).find('i').toggleClass('fa-bars fa-times');
    $(this).toggleClass('cross');
    $('.menu-over ul li').toggleClass('animated-fast slideInLeft')

    $(".menu-over").animate({
    left: "0%",
    }, 1000 );

    $( ".mainsite" ).animate({
    left: "50%",
    width:"50%" ,
    }, 1000 );

  }
  $(this).data("clicks", !clicks);
});
});

Answer 1

尝试return false在函数的末尾。问候

Answer 2

你应该.preventDefault()在你的点击事件中：

  $('.menu-toggle').click(function(event) {
         event.preventDefault();

或者您可以使用return false;which 在您的情况下应该以相同的方式工作：

  $('.menu-toggle').click(function(event) {
         return false;

Answer 3

弄清楚了。感谢所有建议，但奇怪的是没有一个有效。.mainsite 上的宽度动画导致了它。将其更改为填充效果，现在单击时所有内容都保持不变。