jquery扁平手风琴代码

<div class="accordion">
  <div class="accordion-item">
    <button class="accordion-header">Section 1</button>
    <div class="accordion-content">
      <p>Content for section 1 goes here.</p>
    </div>
  </div>
  <div class="accordion-item">
    <button class="accordion-header">Section 2</button>
    <div class="accordion-content">
      <p>Content for section 2 goes here.</p>
    </div>
  </div>
  <!-- 更多部分... -->
</div>

.accordion-content {
  display: none;
}

.accordion-content.active {
  display: block;
}

$(document).ready(function() {
  $('.accordion-header').on('click', function() {
    // 获取当前点击的标题下的内容
    var content = $(this).next('.accordion-content');
    
    // 切换内容的显示状态
    content.toggleClass('active');
    
    // 如果当前内容展开，则关闭其他所有内容
    if (content.hasClass('active')) {
      $('.accordion-content').not(content).removeClass('active');
    }
  });
});