javascript - 从左侧推/滑动菜单。需要通过单击整个页面来隐藏菜单？

Question

我找到了这个 JSFiddle而且我不知道如何修复它，因此用户可以通过单击内容中的任意位置而不是仅单击按钮来退出菜单。我想要多个选项，但我想不通？

    $(document).ready(function() {
    $menuLeft = $('.pushmenu-left');
    $nav_list = $('#nav_list');

    $nav_list.click(function() {
        $(this).toggleClass('active');
        $('.pushmenu-push').toggleClass('pushmenu-push-toright');
        $menuLeft.toggleClass('pushmenu-open');
    });
});

谢谢!

Answer 1

您可以点击 <html/>标记并隐藏菜单:

$('html').click(function() {
    $nav_list.removeClass('active');
    $('.pushmenu-push').removeClass('pushmenu-push-toright');
    $menuLeft.removeClass('pushmenu-open');
});

这需要停止事件冒泡，所以你的第一个点击函数必须从

开始

$nav_list.click(function(e) {
    e.stopPropagation();

整个事情肯定可以优化，但它应该给你一个开始。

这是更新的 Fiddle .