jQuery单击（功能）无法正常工作

Question

我正在尝试通过jQuery创建一个带有slideDown()的可点击子菜单。 但是 - hover()按预期工作，但click()没有做任何事情。

这是我的jQuery：

$("#n_ulist li").click(function(){
    $("ul", this).stop().slideDown(500);
    },
    function() {
    $("ul", this).stop().slideUp(500);  
});

这里有什么问题？

Answer 1

click()函数只接受一个回调作为其参数，因此始终会执行第一个回调slideDown(500); ....

您可以使用slideToggle()

$("#n_ulist li").click(function () {
    $("ul", this).stop().slideToggle(500);
});

hover()将2个回调作为参数，1表示mouseenter，另一个表示mouseleave。有一个toggle()版本对点击事件做了同样的事情，但它在jQuery 1.9中删除了。

如果你想要一个允许你对这个toggleClick()实现做同样看法的插件。

Answer 2

可以使用.slideToggle()。

Answer 3

请尝试以下方法：

$("#n_ulist li").click(function(){
    $(this).parent().find('ul').stop().slideUp(500);
    $("ul", this).stop().slideDown(500);
});

或者如果您的菜单超过一个级别，则可能需要使用

$('#n_ulist').find('ul').stop().slideUp(500);

修改

根据您的意见

$("#n_ulist li").click(function(){
    $(this).parent().find('ul').stop().slideUp(500);
    $("ul", this).stop().slideToggle(500).click(function(e) {
        e.stopPropagation();
    });
});