.removeClass不工作，并阻止.addClass工作

Question

我很难找到任何对这个问题有帮助的信息。我已经尝试了其他几种方法，对这里的其他人有效，但似乎不起作用。

我有一个这样的div设置：

    <div class="dynamic-content">
        <div class="button"></div>
        <div class="content"></div>
    </div>

我想要做的就是在点击.button时将CSS动画应用于.dynamic-content，方法是添加一个特定的类，然后通过再次单击.button并移除这个特定的类来删除该动画。

这是我的jQuery：

    $(".button").on('click', function() {
        if ($(".dynamic-content").hasClass('open')) {
            $(".dynamic-content").removeClass('open'));
        } else {
            $(".dynamic-content").addClass('open'));
        }
    }

如果我不包含.removeClass()部分，addClass就可以完美地工作。但是，我一放入.removeClass，在检查器中，我就可以看到.dynamic-content亮起，就像JS针对并执行操作一样，但什么也没有发生，甚至.addClass也不工作。

Answer 1

这是因为您的代码中有错误的行：

 $(".dynamic-content").removeClass('open'));
                                        //^Remove extra brace

去掉多余的空格，你就可以开始了。

您还可以使用.toggleClass()优化代码

$(".button").on('click', function() {
   $(".dynamic-content").toggleClass('open');
});

Answer 2

JS：

$(".button").on('click', function() {
        if ($(".dynamic-content").hasClass('open')) {
            $(".dynamic-content").removeClass('open');
        } else {
            $(".dynamic-content").addClass('open');
        }
    });

Answer 3

有条件的工作吗？因为".dynamic-content“是一个类，所以jQuery将获得它找到的第一个类。也许在页面上有另一个，它与您的情况播放？

正如人们所说，另一件可能发生的事情是，你额外的")“正在破坏你的功能。

无论哪种方式，我都会尝试toggleClass，它的功能完全符合您的条件：

$(".button").on('click', function() {
    $(".dynamic-content").toggleClass("open")
}

如果类在那里，它就会删除它，如果没有，它就会添加它。