如果點擊了孩子，請不要隱藏燈箱

Question

我有一個燈箱，並且在一個內容豐富的孩子里面。 這個孩子還有一個關閉按鈕。 單擊燈箱或關閉按鈕時，我只想隱藏燈箱。 現在，如果單擊該子項，它也將關閉。

js小提琴

HTML

<div class="lightbox">
    <div class="child">
        <a class="close" href="#"><span>x</span></a>
        <header>
            <h4>content</h4>
        </header>
    </div>
</div>

JS

$('.lightbox, .close').on('click', function(){
    $('.lightbox').fadeOut();
});

Answer 1

嘗試像這樣玩e.target

$('.close,.lightbox').on('click', function (e) {
    if ($(e.target).parents(".lightbox").length && !$(e.target).is(".close,.close > span"))
    return;
    $('.lightbox').fadeOut();
});

DEMO