jquery - 隐藏div点击正文

Question

我有一个通知div，如果用户点击.notification-popup将弹出。我试图这样做，popop div会隐藏每当用户点击该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-弹出虽然随着这个没什么甚至发生。

我应该改变什么？

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');