jquery 单击除 div 和 child 之外的任何内容

Question

我有一个登录窗口，我试图通过单击 div 之外的任意位置(以及用于切换淡入和淡出的登录按钮)来淡出

 jQuery(document).ready(function ($) {
    $('.login').click(function () {
        $('#modal_login').fadeToggle('fast');
    });

    $('body').click(function (e) {
        if (!$(e.target).is('.login, #modal_login *')) {
            $('#modal_login').fadeOut('fast');
        }
    });
});

这一切看起来都很简单，但我的问题是 #modal_login 及其子项。如果您单击 #modal_login div 中的任意位置，它就会淡出。我也尝试过 #modal_login > * 但没有成功。

该代码使用“.login”类按钮运行良好。

所以我的问题是，我是否使用了正确的语法来实现我想要完成的任务(在单击或单击它的任何子级时不让 div 淡出)？看起来合法吗？

Answer 1

解决此问题的一种方法是防止模式内的点击在模式之外冒泡。像这样的事情:

$("#modal_login").click(function(e){
    e.stopPropagation();
});

现在，模态中的点击不会冒泡到执行 fadeOut 的外部处理程序。