Блог

В настоящее время у меня возникли некоторые проблемы с созданием складного элемента в bootstrap 5. Я хочу, чтобы другие разделы закрывались при нажатии на другой складной элемент (похожий на аккордеон). Я хочу, чтобы одновременно можно было открывать только один раздел.

Элемент свертывания начальной загрузки аккуратен; однако я не могу найти пример на их сайте документации, где другой контент сворачивается при расширении. Я провел некоторое исследование, и многие люди говорили об использовании элемента data-parent, но, к сожалению, мне с этим не везет.

Допустим, я хочу, чтобы это произошло с помощью одного из примеров начальной загрузки:

 <p>
  <a class="btn btn-primary" data-bs-toggle="collapse" href="#collapseExample" role="button" aria-expanded="false" aria-controls="collapseExample">
    Link with href
  </a>
  <button class="btn btn-primary" type="button" data-bs-toggle="collapse" data-bs-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
    Button with data-bs-target
  </button>
</p>
<div class="collapse" id="collapseExample">
  <div class="card card-body">
    Some placeholder content for the collapse component. This panel is hidden by default but revealed when the user activates the relevant trigger.
  </div>
</div>
 

Как бы я сделал это, чтобы убедиться, что открытый раздел закрывается при попадании другого элемента свертывания на странице? Этот пример кода является первым на этой странице: https://getbootstrap.com/docs/5.0/components/collapse/

Большое вам спасибо за вашу помощь.