Javascript 单击列表项时取消下拉列表

我有一个下拉列表，在悬停时激活（在悬停离开时取消）。就悬停而言，它工作得很好。当用户单击下拉列表中的某个列表项时，我希望该下拉列表被取消，就像他们将鼠标从列表中移开一样。这就是我被困的地方

$(document).ready(function () { 
    $('.navigation li').hover(
        function () {
            $('ul', this).fadeIn();
        }, 
        function () {
            $('ul', this).fadeOut();        
        }
    );

    // this is where I am attempting to dismiss the drop down list
    // the console output appears just fine, but the drop down list does not
    // go away.
    $('.navigation li').click(function () {
        console.log("clicked");
        $('.ul', this).fadeOut();
    });
});

值得注意的是，每次单击控制台输出都会显示两次。不确定这意味着什么…

您的目标是一类

ul

，而不是

标签

将最后一个代码更改为：

$('.navigation li').click(function () {
    console.log("clicked");
    $('ul', this).fadeOut(); // changed
});

---

通常是简单的事情。：-）

附加一个JSIDLE链接。您的问题中缺少HTML。请加上那个背包！非常感谢@兰德尔Np。我们都需要不时地问别人这些事情，当我们独自工作时，我们会对它们视而不见。这就是为什么我喜欢团队合作而不是独自工作。你可以让人们发现这样的事情。：-）