javascript - Bootstrap アコーディオン ヘッダーにクリック可能な要素がある

Question

アコーディオンを使用しようとしていて、ヘッダー内にチェックボックスがあります。ただし、アコーディオン ヘッダーのチェックボックスをクリックすると、アコーディオンが折りたたまれたり展開されたりします。アコーディオンを展開/折りたたむことなくチェックボックスをクリックする方法はありますか?

Answer 1

チェックボックスをaccordion-toggleの外側に配置する必要がありますが、 accordion-headingクラスの内側に配置する必要があります。

<div class="accordion-heading">
    <input type="checkbox" name="box"/>
    <a class="accordion-toggle" data-toggle="collapse" data-parent="#accordionParent" href="#collapseone">
        <p>Heading1</p>
    </a>
</div>

cssを追加します.accordion-heading a.accordion-toggle { display: inline-block; }