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

我有这个与上面的工作，但我担心捕获一个身体点击是过度的，没有必要。有更好的解决方案吗？

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

jQuery：点击任意位置删除类，不使用$（'body'）。on（'click'

1 个答案: