javascript - Accordion 切换不更改 Bootstrap 3 中的图标

Question

我有使用 bootstrap 3 和 jQuery 进行多重/动态 Accordion 切换的代码:

$('div.accordion-body').on('shown', function () {
    $(this).parent("div").find(".fa").removeClass("fa fa fa-plus").addClass("fa fa-minus");

});

$('div.accordion-body').on('hidden', function () {
    $(this).parent("div").find(".fa").removeClass("fa fa-minus").addClass("fa fa fa-plus");
}); 

但是在 bootstrap 3 中更改图标(fa-plus 到 fa-minus)不起作用。如何解决这个问题？!

Bootstrap 3 DEMO

Answer 1

因为在 Bootstrap 3 中，events shown 和 hidden 已更改为 show.bs.collapse 并且隐藏.bs.collapse:

$('div.accordion-body').on('show.bs.collapse', function () {
    $(this).parent("div").find(".fa").removeClass("fa fa fa-plus").addClass("fa fa-minus");

});

$('div.accordion-body').on('hide.bs.collapse', function () {
    $(this).parent("div").find(".fa").removeClass("fa fa-minus").addClass("fa fa fa-plus");
});

DEMO