javascript - 添加后如何删除类

Question

所以我需要一点帮助。我正在玩弄 addClass 和 removeClass 并且我似乎无法在设置后删除类。我基本上想要的是:

1. 当有人点击 h3 时，它会添加到其父 div 类
2. 当有人点击添加了类的div时，需要移除类

第一步我让开了，它正在工作

$(function(){
    $('div h3.itemTitle').on('click', function(){
        $(this).parent().addClass('active').siblings().removeClass('active');
    });
});

现在当我定义:

$(function(){
    $('div.active').on('click', function(){
        $(this).removeClass('active');
    });
});

它什么都不做，就好像它没有看到类。它只设置那些在 onload...

中设置的

有人帮忙吗？

Answer 1

子元素“h3.itemTitle”已经有一个点击事件监听器，父元素实际上无法捕获点击事件。

您的 $('div.active').on('click', ...) 从未实际触发，因为您点击的是 h3 而不是 div。

我推荐这种方法:http://jsfiddle.net/c3Q6Q/

$('div h3.itemTitle').on('click', function () {
    // saves time not to write $(this).parent() everything so i store in a _parent var
    var _parent = $(this).parent();

    if (_parent.hasClass('active')) {
        _parent.removeClass('active');
    } else {
        _parent.addClass('active').siblings().removeClass('active');
    }
});