Question

我不知道怎么做，因为我是新手。单击按钮.dmenu时我需要一个下拉菜单.dropB，只要按钮被按下或点击按钮外的任何地方，就需要.dmenu到hide。

$('.dropB').click(function(){
      $('.dmenu').toggle();
})

但是，当.dropB之外的任何地方点击时，这不允许隐藏它。请任何帮助将不胜感激。

Answer 1

您可以使用：

$('.dropB').click(function (e) {
    e.stopPropagation();
    $('.dmenu').toggle();
})

$(document).click(function (e) {
    if (!$(e.target).is('.dmenu')) {
        $('.dmenu').hide();
    }
})

<强> Fiddle Demo

Answer 2

使用委托处理文档点击。检查目标，如果它与您的按钮匹配，然后toggle菜单。如果没有，则hide菜单。

演示：http://jsfiddle.net/abhitalks/ztxa2/

$(document).on("click", function(e) {
    var $target = $(e.target);
    if ($target.hasClass("dropB")) {
        $('.dmenu').toggle();
    } else {
        if (! $target.hasClass("dmenu")) {
            $('.dmenu').hide();
        }
    }
})

您可能还想检查目标是否是菜单本身，以免在点击时隐藏自身。

点击外面隐藏按钮

2 个答案: