0

ユーザーが .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 をクリックしても何も起こりません。

何を変更すればよいですか？

4

1 に答える 1

2

1 つの解決策は、通知ラッパーからのクリック イベントの伝播を防ぎ、他のクリックで要素を非表示にすることです。

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

もう 1 つは、クリック ハンドラーのラッパー内でクリックが発生したかどうかをテストすることです。

$(document).on('click', function (e) {
    if ($(e.target).closest($wrapper).length == 0) {
        $wrapper.hide()
    }
});
var $wrapper = $('.notification-list-wrapper');
于 2013-10-25T11:19:56.910 に答える