jquery - anchor 链接不断跳动，无论我做什么

Question

好吧，这让我发疯了!

我正在使用“类似标签”的子菜单来显示 3 个不同的表格。此子菜单中的每个链接都隐藏当前内容并显示另一个内容。

注意:现在我会留下指向页面 I'm working on 的直接链接所以你可以自己检查问题。

为了避免 <a> ( anchor )跳，我已经在尝试了<a onclick="return false;"> (在我拥有的另一个网站上工作正常)。在我的 jQuery 代码中，我还使用了“e.preventDefault();”这有助于避免跳转到页面顶部，但即使使用它，页面也总是跳转到子链接上方的页面的某些部分。

我真的不知道我还能做些什么来避免这种跳跃。

现在这是我的 html 中的内容:

<nav id="submenu" class="menu">
<ul>
    <li class="current-menu-item"><a onclick="return false;" href="#" rel="statics">Sites Estáticos</a></li>
    <li><a onclick="return false;" href="#" rel="dynamics">Sites Dinâmicos</a></li>
    <li><a onclick="return false;" href="#" rel="extras">Serviços Extras</a></li>
</ul>

这是我的 jQuery:

function subSections(){
$('nav.menu li a').click(function(e){
    e.preventDefault(); //this helps, but don't solve the problem
    var active = $(this).parent();
    var currSection = $(this).attr('rel');
    if(active.hasClass('current-menu-item')!=true){
        // Add and remove 'current-menu-item' class
        $('nav.menu .current-menu-item').removeClass('current-menu-item');
        active.addClass('current-menu-item');
        // Hide currentSection and Show the clicked one
        $('.showing').fadeOut('slow', function(){
            $('#'+currSection).fadeIn('slow').addClass('showing');
        }).removeClass('showing');
    }
});

此外，也许有更好的方法来执行此“显示和隐藏”操作，但这似乎工作正常。好吧，如果有人能阐明这个问题并帮助我，我会很高兴!提前致谢!

Answer 1

使用.show()和 .hide()而不是 .fadeIn() 和 .fadeOut()。

如果你想保留动画，你可以尝试.show('slow')和.hide('slow')但是这可能会触发跳转问题还有。