如何为手风琴添加+和 -

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