javascript - jQuery:单击任意位置即可删除类，而不使用 $ ('body' ).on ('click'

Question

我想在单击屏幕上的任意位置时删除所有事件类，但如果单击的元素具有 .dropdown 类，我还想将 .active 类切换到该元素中。

// remove all .active classes when clicked anywhere
hide = true;
$('body').on("click", function () {
    if (hide) $('.dropdown').removeClass('active');
    hide = true;
});

// add and remove .active
$('body').on('click', '.dropdown', function () {

    var self = $(this);

    if (self.hasClass('active')) {
        $('.dropdown').removeClass('active');
        return false;
    }

    $('.dropdown').removeClass('active');

    self.toggleClass('active');
    hide = false;
});

我有这个与上面的工作，但我担心捕获 body 点击是矫枉过正的，而且是不必要的。有更好的解决办法吗？

jsiddle - 我已经为 .active 类设置了几个 li，如果你单击周围你会看到它们被删除。单击 li 将触发 toggleClass('active')，同时仍删除所有 .active 类。

Answer 1

你可以尝试这样做:

$('body').on("click", function (ev) {
    if( $(ev.target).hasClass('.dropdown') ) {
        //you clicked on .dropdown element, do something
    }
    else {
        //you clicked somewhere other than dropdown element
    }
});