我有一个关于我找到的简单 jQuery Accordion 的问题。
我想使用 Font Awesome 图标通过加号和减号图标来指示事件/非事件状态。 在我的 JSFiddle 中,您会看到带有加号图标的 Accordion 标题。当您单击标题时,“fa-plus”类需要更改为“fa-minus”。
我已经用 add 和 removeClass 做了一些测试,但我无法让它工作。我真的是一个 jQuery/javascript 菜鸟!希望你们能帮助我 :-)。
jQuery('.accordion dt').click(function() {
jQuery('.accordion dt').removeClass('active');
jQuery('.accordion_content').slideUp('normal');
if(jQuery(this).next().is(':hidden') == true) {
jQuery(this).addClass('active');
jQuery(this).next().slideDown('normal');
}
});
jQuery('.accordion_content').hide();
最佳答案
为什么不链接你的代码而不是重复你自己:
jQuery('.accordion dt').click(function() {
jQuery(this).find('i').toggleClass('fa-plus fa-minus')
.closest('dt').next().slideToggle()
.siblings('.accordion_content').slideUp();
});
jQuery('.accordion_content').hide();
更新:
您的最终代码应如下所示:
jQuery('.accordion dt').click(function() {
jQuery(this).toggleClass('active').find('i').toggleClass('fa-plus fa-minus')
.closest('dt').siblings('dt')
.removeClass('active').find('i')
.removeClass('fa-minus').addClass('fa-plus');
jQuery(this).next('.accordion_content').slideToggle()
.siblings('.accordion_content').slideUp();
});
jQuery('.accordion_content').hide();
关于javascript - jQuery Accordion 在点击时更改 Font Awesome 图标类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21166436/