Question

如果用户点击.notification-popup，我会弹出一个通知div。我试图这样做，只要用户点击该DIV的一侧，popop div就会隐藏。

目前我有这个：

$('body').on('click', function (e) {
                    $('.notification-list-wrapper').each(function () {
                        //the 'is' for buttons that trigger popups
                        //the 'has' for icons within a button that triggers a popup
                        if (!$(this).is(e.target) && $(this).has(e.target).length === 0 && $('.notification-list-wrapper').has(e.target).length === 0) {
                            $(this).hide();
                        }
                    });
                });

虽然单击.notification-popup时，甚至没有发生任何事情。

我应该改变什么？

Answer 1

一种解决方案是阻止来自通知包装器的点击事件传播，并在任何其他点击上隐藏元素

$(document).on('click', function (e) {
    $wrapper.hide();
});
var $wrapper = $('.notification-list-wrapper').click(function (e) {
    e.stopPropagation()
})

另一个可能是测试点击处理程序

中的包装内是否发生了点击

$(document).on('click', function (e) {
    if ($(e.target).closest($wrapper).length == 0) {
        $wrapper.hide()
    }
});
var $wrapper = $('.notification-list-wrapper');

jquery - 在点击主体上隐藏div

1 个答案: