Javascript 上次子项单击不会更改

当我选择框2时，我希望边框变成黑色。 再单击一次，它将返回黄色

第一次单击向右移动，但第二次单击保持黑色。 我可以通过添加另一个类来解决这个问题，但我不想这样做

我还能怎么做

这是我的代码：

<div class="aa">
    <div class="bb">1</div>
    <div class="cc"></div>
</div>
<div class="aa">
    <div class="bb">2</div>
    <div class="cc"></div>
</div>

样本检查

您基本上需要删除类（如果它有）

$('.bb:last').addClass('yellow');

$('.bb').click(function () {
    $(this).next('.cc').fadeToggle();
    if (!$('.cc:last').is(':hidden')) {
        if ($('.bb:last').hasClass('black')) {
            $('.bb:last').removeClass('black');
        } else {
            $('.bb:last').addClass('black');
        }
    } else {
        $('.bb:last').addClass('yellow');
    }
});

检查这个

您基本上需要删除类（如果它有）

$('.bb:last').addClass('yellow');

$('.bb').click(function () {
    $(this).next('.cc').fadeToggle();
    if (!$('.cc:last').is(':hidden')) {
        if ($('.bb:last').hasClass('black')) {
            $('.bb:last').removeClass('black');
        } else {
            $('.bb:last').addClass('black');
        }
    } else {
        $('.bb:last').addClass('yellow');
    }
});

简单得多：

简单得多：

---

非常简单的解决方案。只需使用。切换类别“黄黑”。toggleClass将为您处理一切。空间分隔列表中设置的任何类都将被清除，反之亦然。要仅影响最后一个.bb，可以将其放入自己的处理程序中：

$('.bb:last').addClass('yellow').click(function() {
    $(this).toggleClass('yellow black');
});
$('.bb').click(function () {
    $(this).next('.cc').fadeToggle();
});

---

非常简单的解决方案。只需使用。切换类别“黄黑”。toggleClass将为您处理一切。空间分隔列表中设置的任何类都将被清除，反之亦然。要仅影响最后一个.bb，可以将其放入自己的处理程序中：

$('.bb:last').addClass('yellow').click(function() {
    $(this).toggleClass('yellow black');
});
$('.bb').click(function () {
    $(this).next('.cc').fadeToggle();
});

---

非常感谢你！！hasClass，以前从未见过。非常感谢！！hasClass，以前从未有过。@PSCoder这意味着我们都喜欢简单性：您应该将$this存储在一个变量中，而不是初始化jQuery三次。这段代码被破坏了。如果在调试器中观看，div将以类bb yellow，black结束，这只是巧合。toggleClass采用空格分隔的列表，不带逗号。此外，您不需要.hasClass检查。@JeffB您完全是对的，我不知道为什么我记得里面必须是逗号。谢谢，现在我把它做得更简单了。@PSCoder这意味着我们都喜欢简单：你应该把$this存储在一个变量中，而不是初始化jQuery三次。这段代码是错误的。如果在调试器中观看，div将以类bb yellow，black结束，这只是巧合。toggleClass采用空格分隔的列表，不带逗号。此外，您不需要.hasClass检查。@JeffB您完全是对的，我不知道为什么我记得里面必须是逗号。谢谢，现在我把它做得更简单了。在你的演示中，第一个元素在类和边框上疯了，恐怕这不是OP需要的。疯了？也许我不清楚OP想要什么。如果他们不想让第一个更改边框样式，这很容易，正如您在示例中所示。您也可以使用一个单独的处理程序，如我更新的示例中所示。在您的演示中，第一个元素使用类和边框变得疯狂，恐怕这不是OP所需要的。疯狂了吗？也许我不清楚OP想要什么。如果他们不想让第一个更改边框样式，这很容易，正如您在示例中所示。您还可以使用单独的处理程序，如我更新的示例中所示。

$('.bb:last').addClass('yellow').click(function() {
    $(this).toggleClass('yellow black');
});
$('.bb').click(function () {
    $(this).next('.cc').fadeToggle();
});