jQuery:链接在 .toggle() 之后不起作用

Question

我刚刚构建了一个下拉菜单，我想在单击时将其下拉，并在另一次单击后返回。这与我使用过的切换功能完美配合，但问题是下拉菜单后，链接不会执行。

$(函数(){

    $("#nav_menu-2 ul.menu ul").css({ display: 'none' });


    $("#nav_menu-2 ul.menu #testbutton").toggle(function() {


        $(this).find('ul.sub-menu')
            .stop(true, true).delay(50).animate({ "height": "show", "opacity": "show" }, 300 );
    }, function(){

        $(this).find('ul.sub-menu')
            .stop(true, true).delay(50).animate({ "height": "hide", "opacity": "hide" }, 300 );
    });

});

所以我的猜测是，菜单下降后，单击即可返回，而不是执行链接。但由于我对 javascript/jQuery 很陌生，所以我不知道还有什么其他选择。有什么想法吗？

Answer 1

我会使用 slideToggle ，绑定(bind)到应打开菜单的按钮的单击事件:

$("#nav_menu-2 ul.menu #testbutton").click(function() {
  $('ul.sub-menu').slideToggle();
});

您可能需要稍微更改选择器，具体取决于菜单的构造方式。