Я пытаюсь создать аккордеон, используя Bootstrap 3, используя кнопку, сжимаемую с атрибутом данных, без аккордеонной разметки. Для меня это выглядит намного чище.
Однако я не могу заставить атрибут data-parent работать. Я хочу, когда открываю вопрос, все остальные закрываются. Я читаю документы (http://getbootstrap.com/javascript/#collapse-usage), но все равно не может заставить его работать.
Я использую следующий код:
<div class="accordion" id="myAccordion">
<button type="button" class="btn btn-danger" data-toggle="collapse" data-target="#collapsible-1" data-parent="#myAccordion">Question 1?</button>
<div id="collapsible-1" class="collapse">
<p>Etiam posuere quam ac quam. Maecenas aliquet accumsan leo. Nullam dapibus fermentum ipsum. Etiam quis quam. Integer lacinia. Nulla est.</p>
</div>
<button type="button" class="btn btn-danger" data-toggle="collapse" data-target="#collapsible-2" data-parent="#myAccordion">Question 2?</button>
<div id="collapsible-2" class="collapse">
<p>Etiam posuere quam ac quam. Maecenas aliquet accumsan leo. Nullam dapibus fermentum ipsum. Etiam quis quam. Integer lacinia. Nulla est.</p>
</div>
<button type="button" class="btn btn-danger" data-toggle="collapse" data-target="#collapsible-3" data-parent="#myAccordion">Question 3?</button>
<div id="collapsible-3" class="collapse">
<p>Etiam posuere quam ac quam. Maecenas aliquet accumsan leo. Nullam dapibus fermentum ipsum. Etiam quis quam. Integer lacinia. Nulla est.</p>
</div>
</div>
Вот JSFiddle: http://jsfiddle.net/twinsen/AEew4/
Я буду очень рад, если кто-то укажет на меня, где я делаю ошибку:\