如何在手风琴上添加 + 和 -

Question

我已经实现了一个基本的手风琴，我需要在手风琴上添加 + 和 -。

如果手风琴是打开的，那么'-'应该是'+'

这是尝试过的：

JS：

$('.info').find('.accordion-toggle').click(function () {
    //Expand or collapse this panel
    $(this).next().slideToggle('fast');
    //Hide the other panels
    $(".accordion-content").not($(this).next()).slideUp('fast');
}); 

Demo Link

Answer 1

可以如下使用css伪元素：

CSS：

.accordion-toggle::after {
  content:"+";
}
.accordion-toggle.open::after {
  content:"-";
}

JS：

$('.info').find('.accordion-toggle').click(function () {
  //Expand or collapse this panel
  $(this).toggleClass("open").next().slideToggle('fast');

  //Hide the other panels
  $(".accordion-toggle").not($(this)).removeClass("open");
  $(".accordion-content").not($(this).next()).slideUp('fast');
});

Demo