Question

我试图改善菜单界面：

我认为点击它是很棒的，但我确实认为，如果用户点击其他任何地方，例如屏幕的下角，如果菜单不是，则应该关闭菜单。已经。

$(document).ready(function () {
    $('#nav li').mousedown(function () {
        $('ul #items').toggle(100);
    });
});

如何以尽可能有效的方式解决这个问题？如果菜单打开，我们是否需要跟踪每次鼠标点击并查看它是否在菜单上？

Answer 1

您需要将单击处理程序附加到关闭菜单的document：

$('#nav li').click(function (e) {
    e.stopPropagation();
    $('ul #items').toggle(100);
});

$(document).click(function() {
    $('#items').hide();
});

请注意，在开始链接上需要stopPropagation才能阻止事件到达文档本身。

Answer 2

$(document).ready(function () {
    $('#nav li').mousedown(function (event) {
        event.stopPropagation();
        $('ul #items').toggle(100);
    });
     $(document).mousedown(function(e) {
         $('ul #items').css('display','none'); //make all inactive`enter code here`
    });
});

界面菜单，如果打开则关闭，用户单击外部菜单

2 个答案: