jQuery - 单击并添加类触发另一个(相关)单击？

Question

我正在创建一个菜单。菜单如下。

$('.category').mouseover(function() { $(this).removeClass('category').addClass('categoryhover'); }).mouseout(function() { $(this).removeClass('categoryhover').addClass('category'); });
$('.category').click(function() { $('.catmenu').removeClass('catmenu').addClass('hide'); $('.categoryact').removeClass('categoryact').addClass('category'); $('.hide', this).removeClass('hide').addClass('catmenu'); $(this).removeClass('category').addClass('categoryact'); });
$('.categoryact').live('click', function() { $('.catmenu').removeClass('catmenu').addClass('hide'); $(this).removeClass('categoryact').addClass('category'); });

单击带有类别类别的 div 将为该类别提供一个新类 (categoryact) 并显示其子菜单。大概再次点击它会隐藏它。但是，当给被点击的 div 赋予新类(categoryact)的事件时，隐藏它的函数也会被触发。结果当然是第一次点击，显示子菜单，似乎什么都不做。我们当然知道它实际上是在发射另一个。

有人能告诉我为什么它会触发“隐藏”功能，以及可能的修复方法吗？或者该死的，一种更简单的写法。有很多添加/删除类正在进行。 ;)

谢谢。

Answer 1

(从评论中复制过来，所以可以接受答案)

使用 jQuery 的 toggle() 不是更容易吗？和 toggleClass()功能？ ...那样，您可能根本不需要 live() 绑定(bind)，因为简单的 click() 会切换类和子菜单