jquery - divslidingUp 问题

Question

我有一个 div .adsearch-panel，其中包含一些选择框和文本框。我想在 div 外部单击时隐藏它。为此，我正在使用；

$(document).on({
    mouseup:
    function(e){
        var container = $('.adsearch-panel');

        if(container.has(e.target).length === 0) {
            container.slideUp(200);
        }
    }
});  

上面的代码运行良好，但即使我单击该 div 内的任何元素（例如选择框），它仍然会向上滑动。如果单击 div 或 div 内的任何内容，我想让它保持可见。

请帮我解决这个问题。

谢谢你和问候。

Answer 1

你的on方法不正确，应该是：

$('document').on("mouseup", function (e) {
    var container = $('.adsearch-panel');

    if(container.has(e.target).length === 0) {
        container.slideUp(200);
    }
});

Answer 2

我相信e.target这里指的是document. 您必须stopPropagation在 div 上添加一个用于单击的内容：

$('.adsearch-panel').on('mouseup', function(e) { e.stopPropagation(); });

Answer 3

LIVE DEMO

$(function(){
    $("body").on('click', function(ev) {
        var myCN = ev.target.className;
        if (myCN !== 'adsearch-panel') {
            $('.adsearch-panel').hide();
        }
    });

    $('.showAdsearch').on('click', function( e ) {
        e.stopPropagation();
        $('.adsearch-panel').show();
    });
});