Question

构建移动菜单，并希望当用户点击文档时，而不是菜单关闭菜单，如果它打开。问题是，当第一次点击被触发打开手机时，它会自动关闭。我正在努力让这一点工作。

代码识别出点击，因此窗口正在检测正确的操作。我想，我只是错过了最后一步。

代码是：

$('.mobile-menu-button').click(function(e) {
    e.preventDefault();
    $('.mobile-menu').slideToggle('slow');
});
// close on off click
$(window).click(function(e){
    e.preventDefault();
    e.stopPropagation();
    if($('.mobile-menu').css("display") == 'block') {
        $('.mobile-menu').slideToggle();
        console.log('click');
    }
});

由于

Answer 1

您可以使用事件委派。当您单击“.mobile-menu”时，您打开它或关闭它，当您点击其他地方时，只关闭它。

$(window).on('click', function(e){
    e.preventDefault();
    if ($(e.target).hasClass('mobile-menu-button')) {
      $('.mobile-menu').slideToggle('slow');
    } else {
      $('.mobile-menu').css('display') === 'block' && $('.mobile-menu').slideUp();
    }
});

这个小提琴的一个基本例子：https://jsfiddle.net/6e7atrmn/2/

jQuery关闭菜单自动关闭

1 个答案: