我有一个简单的手风琴我用Jquery制作。它可以切换项目的打开和关闭,也可以关闭任何其他活动项目。
以下是代码:
$(document).ready(function($) {
$('#accordion').find('.accordion-toggle').click(function(){
$(this).toggleClass('activeState');
// Remove active state from other panels not selected
$("#accordian").not($(this)).removeClass('activeState');
//Expand or collapse this panel
$(this).next().slideToggle('fast');
//Hide the other panels
$(".accordion-content").not($(this).next()).slideUp('fast');
});
});
现在我正在使用' activeState'类添加黄色的背景颜色(后来我希望使用图标类)。现在,当打开和关闭同一个项目时,它可以很好地切换。但是我希望它在单击另一个手风琴项时切换/删除activeState类(然后显然将activeState类附加到新打开的手风琴项。我试图使用" .not()" jQuery函数从任何不是被点击的活动对象的' .accordian-toggle"项目中删除activeState类。我在这里是因为我没有运气。
这是JSFiddle https://jsfiddle.net/0LLncd4d/26/ 我可以请求一些我可能忽略的帮助吗?
答案 0 :(得分:3)
替换两行
$(this).toggleClass('activeState');
$("#accordian").not($(this)).removeClass('activeState');
带
$('.accordion-toggle').removeClass('activeState');
if($(this).parent().find('.accordion-content').css('display')=='none'){
$(this).addClass('activeState');
}
答案 1 :(得分:1)
试试这样:
$(document).ready(function($) {
$('#accordion').find('.accordion-toggle').click(function(){
$(this).toggleClass('activeState');
// Remove active state from other panels not selected
$(".accordion-toggle").not($(this)).removeClass('activeState');
//Expand or collapse this panel
$(this).next().slideToggle('fast');
//Hide the other panels
$(".accordion-content").not($(this).next()).slideUp('fast');
});
});