Question

我正在处理的项目中有一些过滤器，一旦点击，它就会被赋予一个active类，然后会在被点击的列表项info-pane中显示一个div。

过滤器是6个蓝色框。我正在使用下面的jQuery来添加和删除活动类，但是当我想通过单击具有活动类状态的列表项来尝试删除活动类时会出现问题，但它似乎不起作用。

我正在尝试的代码;

$(".filters > ul > li").click(function() {
    $(".filters > ul > li").removeClass("active");
    $(this).toggleClass("active");
});
$(".filters > ul > li.active").click(function() {
    $(this).removeClass("active");
});

这是实时项目的链接; http://client.n8geeks.com/

Answer 1

试试这个：

$(".filters > ul > li").click(function() {
    $(".filters > ul > li").not($(this).toggleClass("active")).removeClass("active");
});

Answer 2

首先，您不需要为该点击制作两个事件。这是一个例子。但我无法看到你的问题所在。在您的实时项目中，我可以看到点击后过滤器发生了变化..？

$(".filters > ul > li").click(function() {
        $(".filters").find('li').removeClass('active');    
        $(this).addClass("active");
    });

编辑：

我不知道我是否理解正确，但是当你点击“x＆＃39; x＆＃39;没有任何反应..所以重置过滤器的功能。

<强>（非测试）

$(".close").click(function(){
  $(this).closest('ul > li').find('input[type="checkbox"]').each(function( index ) {
    $(this).prop('checked', false);
  });   
});

在点击问题上删除活动类

2 个答案: