1

Bootztrapを使用して折りたたみ可能なアコーディオンを設計しようとしていますが、情報はすべてアコーディオンと一緒に表示されます(Djangoテンプレートを使用してループします)。

私が抱えている唯一の問題は、見出しが開いて内容が明らかにならないことです。最初のものは、コンテンツを表示するように設計されているため、最初から開いているように見えますが、閉じません。

別のアコーディオン用にアプリケーションの別のテンプレートでまったく同じ方法を使用しましたが、問題なく機能します。「クリック」に問題があるようです。

これを修復する方法についての洞察をいただければ幸いです。

アコーディオンセクションのコードは次のとおりです。

    <div class="span4 offset1">
    <h2>Notes</h2>
    <div class="accordion" id="note_accordion">
        {% for note in user.notes.all reversed %}
            <div class="accordion-group">
                <div class="accordion-heading">
                    <a class="accordion-toggle note-header well" data-toggle="collapse" href="#note_{{ note.id }}">
                      {{ note.title }} – {{ note.date }}</a>
               </div>
                <div id="notes{{ note.id }}" class="accordion-body collapse{% if forloop.counter0 == 0 %} in{% endif %}">
                    <div class="accordion-inner">
                        <div>
                                <p>{{ note.copy|linebreaksbr }}</p>
                        </div>
                    </div>
                </div>
               </div>
                {% endfor %}    
            </div>
    </div>  
</div>

4

1 に答える 1

3

id同じ値と値を使用しなかったようhrefです:

<a ... href="#note_{{ note.id }}"> <!-- href="#note_1" -->

<div id="notes{{ note.id }}" ... > <!-- id="notes1" -->
于 2012-07-04T17:28:21.210 に答える