onclick addClass，如何再次删除类

Question

我已经有了这段代码来切换侧面板：

$(".example_wrapper_panel_link").click(function() { 
$(".example_wrapper").addClass('example_wrapper_active'); 
$(".example_wrapper_panel").animate({width: "toggle"}, 400);

addClass工作正常，但现在当我再次点击隐藏div时，我想再次删除添加的类。

似乎找不到这种情况的解决方案。

提前感谢您的帮助。

Answer 1

您应该使用.toggleClass()方法。

$(".example_wrapper_panel_link").click(function() { 
   // instead of addClass() just use toggleClass()
   $(".example_wrapper").toggleClass('example_wrapper_active'); 
   $(".example_wrapper_panel").animate({width: "toggle"}, 400);
});

如果不存在，

.toggleClass() 会将类添加到目标，如果存在，则将其再次删除。

Answer 2

.removeClass()删除了一个给定的类。

.toggleClass()切换一个给定的类，这意味着它会在缺少的情况下添加该类，否则会将其删除。

所以你的处理程序可能变得如此简单：

$(".example_wrapper").toggleClass('example_wrapper_active'); 

removeClass()和toggleClass()

的文档

Answer 3

.removeClass('class');应该这样做，see the jQuery API here。如果您对交替感兴趣，.toggleClass('class');可能更合适。

Answer 4

尝试使用.toggleClass。

$(".example_wrapper").toggleClass('example_wrapper_active');

Answer 5

您应该使用.toggleClass()代替.addClass()和.removeClass()。