使用 Jquery .toggle() 打开一个下拉菜单，点击时需要改变颜色的链接答案

【问题标题】：Using Jquery .toggle() to open a dropdown menu, need the link to change color when clicked使用 Jquery .toggle() 打开一个下拉菜单，点击时需要改变颜色的链接
【发布时间】：2012-04-03 23:59:05
【问题描述】：

我正在使用以下代码来打开基于 ul 的下拉菜单，我设置了 css，以便在悬停时“按钮”会改变颜色，但我需要它在菜单显示时保持该颜色打开。

<script>
$(document).ready(function () {

$('#nav li').toggle(
    function () {
        //show its submenu
        $('ul', this).slideDown(100);
        $('#libg').toggleClass('clicked');
    },
    function () {
        //hide its submenu
        $('ul', this).slideUp(100);
        $('#libg').toggleClass('notclicked');
    }
);
});
</script>

萤火虫没有任何错误，幻灯片事件工作得很好，也许我没有调用正确的东西？ #libg 是包含“按钮”的 li 的 id。 clicked / notclicked 类只会改变背景颜色。

http://jsfiddle.net/5tV45/

【问题讨论】：

jsFiddle，好吗？
显示 HTML 会很有用。

标签： jquery toggle slide

【解决方案1】：

我希望你想要两次切换 clicked 类，所以当它被删除时，它处于 notclicked 的状态

    // replace this...
    // $('#libg').toggleClass('notclicked');
    // with this...
    $('#libg').toggleClass('clicked');

【讨论】：

这个和上面的帖子似乎没有做任何事情。如果有帮助，我已经在原始帖子的评论中发布了 jsfiddle。
javascript 有效，样式规则不够具体，正在被覆盖。尝试：li#libg.clicked li a { color: #fff; background-color: #839367; } ，它将作用于 ID 为 libg 的单击项目中的列表项中的锚点。
我不确定你的意思，如果我把那行放在 css 中，它会使下拉列表的很大一部分改变颜色，这是我不想要的。
已使用 #libg.clicked { color: #fff;背景颜色：#839367； }
很高兴你得到了你想要的，~)

【解决方案2】：

您只需要在“点击”类中指定颜色并在两个函数中切换它：

$('#nav li').toggle(
    function () {
        //show its submenu
        $('ul', this).slideDown(100);
        $('#libg').toggleClass('clicked');
    },
    function () {
        //hide its submenu
        $('ul', this).slideUp(100);
        $('#libg').toggleClass('clicked');
    }
);

在您关闭菜单时，在您的版本中“单击”类留在菜单项上。

【讨论】：

不幸的是，它没有任何不同。

【解决方案3】：

你能在函数中设置颜色吗？

$(this).css({color: '#f00'});

...设置颜色，以及...

$(this).css({color: ''});

... 取消设置。尽管使用 add/removeClass 可能会更好

【讨论】：