javascript - 单击特定元素时的 jQuery addClass

Question

我正在尝试为菜单项设置动画。 在移动时它向左扩展，在鼠标移开时它收缩回来。 这很好用。

我也试图在点击时添加一个类来给按钮一个特定的颜色，但它似乎不起作用。

这是一个 fiddle http://jsfiddle.net/g3ra912j/

CSS:

    #menu1 .active {
        background-color: #00f;
    }

脚本:

$("#menu1").click(function () {
    $(this).toggleClass("active")
})

点击它应该变成蓝色，但它没有。 我做错了什么？

谢谢

Answer 1

您的 CSS 中有一个额外的空间。应该是

#menu1.active {
    background-color: #00f;
}

因为您要将类 .active 添加到具有 id menu1 的相同元素。原始 CSS 将以类为 .active inside #menu1 的元素为目标。