Question

好的，好的。我正在尝试使用fadeToggle（）创建一个下拉菜单。

http://westrock.juggernautwebsites.com/是网站目前所在的位置。

如您所见，当用户选择“属性”时，会出现fadeToggle。但是，在下拉发生后，并且用户想要从属性下拉列表中选择li，他们无法（我知道我已经返回false;设置，但那应该是原始ul，不是吗？）

同样，当子项目显示时，如果将鼠标悬停在“关于”上，则：“悬停”效果将显示在“属性”子项li上。

我很难过。任何帮助，非常感谢。

$('#menu-item-13').click(function() {
    $(this).children('ul').fadeToggle({
        duration: 200
    });
    return false;
});

*编辑我觉得我需要限制css和jQuery影响子列表项和a，但我不知道如何做到这一点。我认为孩子们只在DOM下了一级，因为我选择了'ul'，这个函数不会影响列表项......

Answer 1

您的示例对我来说根本不起作用，但如果我理解正确，您希望子ul不受附加到父级的点击处理程序的影响。你可以这样做：

$('#menu-item-13 > ul').click(function(e){
   e.stopPropagation();

   // ... do your thing
});

这基本上会阻止点击ul从冒泡到父#menu-item-13。因此，fadeToggle也不会因点击ul而触发，因此如果仍然需要，则必须将其添加到ul的点击中。

Answer 2

感谢大家的帮助！这是我最终最终使用的内容。

$('#primary li').hover(function() {
    $(this).children('ul').fadeToggle({
        duration: 200
    });
});
    $('menu-item-54').click(function() {
    return false;
});

我想在悬停（或点击）时尝试完成，subnav将展开。

jQuery，fadeToggle和list-items

2 个答案: