Question

我需要创建一个与此相同的菜单：

http://www.girard-perregaux.com/collection/univers-en.aspx?type=1

然后点击制造商上的集合，然后再点击制造商关闭。正如你所看到的那样它首先向下滑动，然后它只是改变链接而不再上下滑动，直到你点击相同的开放元素。

我首先尝试过这个：

$('ul.sub-menu').hide();
$('.sf-menu').children('li').click(function(){  
    $(this).children(".sub-menu").slideToggle('slow');
    $('ul.sub-menu').hide();

它正常工作但每次点击菜单时都会上下滑动，而不仅仅是更改列表项。所以我发现我需要以某种方式定位子li元素而不是ul。此外，如果您在parrent列表项之间单击，则需要在该菜单上进行切换，但如果我再次单击同一个打开的列表项，则需要关闭（向上滑动。）

非常感谢你，因为我花了半天的时间试图解决这个问题。另外如何针对儿童李，我试过这个：

$('.sf-menu').children('li').click(function(){  

$(this).children(".sub-menu li")

但没有。

Answer 1

您可以尝试将点击绑定到子菜单并使用e.stopPropagation()和e.stopImediatePropagation()：http://jsfiddle.net/7eCjd/

$menu.find(">li>ul").on("click", function(e) {
    e.stopPropagation();
    e.stopImediatePropagation();
});

当您点击子菜单时，这将不允许子菜单关闭。

Jquery简单的菜单

1 个答案: