Jquery手风琴表应该有活动类切换(Jquery accordion table should have the active class toggled)

Jquery手风琴表应该有活动类切换(Jquery accordion table should have the active class toggled)

通过单击表我应该在单击的TR上添加一个Active类，并通过关闭它或单击另一个表来删除它。

我错过了什么？

演示： http ： //jsfiddle.net/ve3ctfz6/

JS：

$(function () { var $list = $('.table'); $list.find("tr").not('.accordion-wrapper').hide(); $list.find("tr").eq(0).show(); $list.find(".accordion-wrapper").click(function () { $list.find('.accordion-wrapper').not(this).siblings().fadeOut(500); $(this).siblings().fadeToggle(500); $(this).addClass('active'); $list.find('.accordion-wrapper').not(this).removeClass('active'); if ($list.find('.accordion-wrapper').hasClass('active')) { $list.find('.accordion-wrapper').not(this).removeClass('active'); } else if ($(this).is('.active')) { $(this).siblings().fadeToggle(500); $('.active').removeClass('active'); } }); });

By clicking the table I should add a Active class on the clicked TR and able to remove it by closing it or by clicking on another table.

What am I missing?

demo: http://jsfiddle.net/ve3ctfz6/

Js:

$(function () { var $list = $('.table'); $list.find("tr").not('.accordion-wrapper').hide(); $list.find("tr").eq(0).show(); $list.find(".accordion-wrapper").click(function () { $list.find('.accordion-wrapper').not(this).siblings().fadeOut(500); $(this).siblings().fadeToggle(500); $(this).addClass('active'); $list.find('.accordion-wrapper').not(this).removeClass('active'); if ($list.find('.accordion-wrapper').hasClass('active')) { $list.find('.accordion-wrapper').not(this).removeClass('active'); } else if ($(this).is('.active')) { $(this).siblings().fadeToggle(500); $('.active').removeClass('active'); } }); });

最满意答案

更改

$(this).addClass('active');

至

$(this).toggleClass('active');

演示

Change

$(this).addClass('active');

to

$(this).toggleClass('active');

Demo