Jquery 不管我做什么，锚链总是在跳

好吧，这让我发疯了

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

注意：现在，我会留下一个直接指向该页面的链接，以便您可以自己检查问题

为了避免

（锚定）跳转，我已经在尝试

（这在我拥有的另一个站点上运行良好）。在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>

}

另外，也许有更好的方法来做这个“展示和隐藏”的东西，但这似乎工作得很好。好吧，如果有人能解释这个问题并帮助我，我会很高兴的！提前谢谢

使用和，而不是

.fadeIn（）

和

.fadeOut（）

---

如果您想保留动画，可以尝试

.show（'slow'）

和

.hide（'slow'）

，但这也可能引发跳转问题。

此外，只需重构一点代码并节省一点键入（并使脚本更具动态性），您不需要在每个html链接上编写

onclick=“return false；”

。只需将return false放在jQuery中的.click函数的末尾

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');

    // Return false for all links in the nav onclick
    return false;

    }
});

---

注意，它并不是真的在任何地方跳跃。您正在更改页面的高度，因此，如果页面变小，它自然会重新定位视口。谢谢您的快速回答。我知道我在改变页面的高度。如果我使用的最小高度至少是较大内容的高度，问题就解决了（我已经检查过了），但是必须有一种方法来避免这种跳跃，不是吗？它甚至可以跳到子菜单的顶部，但不能跳到上面太多，因为它正在做=\n而不是

fadeOut（）

和

fadeIn（）

您是否尝试过使用

show（）

和

hide（）

？Jason，太棒了！这就解决了跳跃问题！奇怪的是我的动画不见了。不管怎样，我可以使用show（）和hide（）来保持动画效果？无论如何，这已经是我问题的一个很好的答案！=]@太棒了！我将把它写下来作为正式答案。是的，当动画发生时，跳转再次被触发=（但是，它起作用了！谢谢Jason；）@7th，我很高兴它对你起作用，并感谢你将此标记为已接受的答案。要求追加投票会不会太麻烦

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');

    // Return false for all links in the nav onclick
    return false;

    }
});