Я пытаюсь создать выпадающее меню FAQ с загрузкой.
Итак, я создал коллапс:
<div class="container textcontainer accordion" id="accordionExample">
<div class="card">
<div class="card-header" id="headingOne">
<h5 class="mb-0">
<button class="btn btn-link" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Was frühstücken die Kleinen?
</button>
</h5>
<button id="12a" class="btn" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="false" aria-controls="collapseOne"><img src="img/click-elements/Arrow_FAQ.svg"></button>
</div>
<div id="collapseOne" class="collapse" aria-labelledby="headingOne" data-parent="#accordionExample">
<div class="card-body">
Zum Frühstück sollen die Kinder einen kleinen Imbiss (Butterbrot, Obst, Joghurt etc.) mitbringen.
Süßigkeiten (dazu zählt auch die Milchschnitte) sollen grundsätzlich nicht mitgegeben werden.
Ein solches „Frühstück“ packen wir den Kindern wieder in die Tasche.</div>
<button id="12a" class="btn" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="false" aria-controls="collapseOne"><img src="img/click-elements/Line_FAQ.svg"></button>
</div>
</div>
<div class="card">
<div class="card-header" id="headingTwo">
<h5 class="mb-0">
<button class="btn btn-link" type="button" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="true" aria-controls="collapseTwo">
Was frühstücken die Kleinen?
</button>
</h5>
<button id="12a" class="btn" type="button" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"><img src="img/click-elements/Arrow_FAQ.svg"></button>
</div>
<div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#accordionExample">
<div class="card-body">
Zum Frühstück sollen die Kinder einen kleinen Imbiss (Butterbrot, Obst, Joghurt etc.) mitbringen.
Süßigkeiten (dazu zählt auch die Milchschnitte) sollen grundsätzlich nicht mitgegeben werden.
Ein solches „Frühstück“ packen wir den Kindern wieder in die Tasche.</div>
<button id="12a" class="btn" type="button" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"><img src="img/click-elements/Line_FAQ.svg"></button>
</div>
</div> <div class="card">
<div class="card-header" id="headingThree">
<h5 class="mb-0">
<button class="btn btn-link" type="button" data-toggle="collapse" data-target="#collapseThree" aria-expanded="true" aria-controls="collapseThree">
Was frühstücken die Kleinen?
</button>
</h5>
<button id="12a" class="btn" type="button" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"><img src="img/click-elements/Arrow_FAQ.svg"></button>
</div>
<div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#accordionExample">
<div class="card-body">
Zum Frühstück sollen die Kinder einen kleinen Imbiss (Butterbrot, Obst, Joghurt etc.) mitbringen.
Süßigkeiten (dazu zählt auch die Milchschnitte) sollen grundsätzlich nicht mitgegeben werden.
Ein solches „Frühstück“ packen wir den Kindern wieder in die Tasche.</div>
<button id="12a" class="btn" type="button" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"><img src="img/click-elements/Line_FAQ.svg"></button>
</div>
</div> <div class="card">
<div class="card-header" id="headingFour">
<h5 class="mb-0">
<button class="btn btn-link" type="button" data-toggle="collapse" data-target="#collapseFour" aria-expanded="true" aria-controls="collapseFour">
Was frühstücken die Kleinen?
</button>
</h5>
<button id="12a" class="btn" type="button" data-toggle="collapse" data-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour"><img src="img/click-elements/Arrow_FAQ.svg"></button>
</div>
<div id="collapseFour" class="collapse" aria-labelledby="headingFour" data-parent="#accordionExample">
<div class="card-body">
Zum Frühstück sollen die Kinder einen kleinen Imbiss (Butterbrot, Obst, Joghurt etc.) mitbringen.
Süßigkeiten (dazu zählt auch die Milchschnitte) sollen grundsätzlich nicht mitgegeben werden.
Ein solches „Frühstück“ packen wir den Kindern wieder in die Tasche.</div>
<button id="12a" class="btn" type="button" data-toggle="collapse" data-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour"><img src="img/click-elements/Line_FAQ.svg"></button>
</div>
</div> <div class="card">
<div class="card-header" id="headingFive">
<h5 class="mb-0">
<button class="btn btn-link" type="button" data-toggle="collapse" data-target="#collapseFive" aria-expanded="true" aria-controls="collapseFive">
Was frühstücken die Kleinen?
</button>
</h5>
<button id="12a" class="btn" type="button" data-toggle="collapse" data-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive"><img src="img/click-elements/Arrow_FAQ.svg"></button>
</div>
<div id="collapseFive" class="collapse" aria-labelledby="headingFive" data-parent="#accordionExample">
<div class="card-body">
Zum Frühstück sollen die Kinder einen kleinen Imbiss (Butterbrot, Obst, Joghurt etc.) mitbringen.
Süßigkeiten (dazu zählt auch die Milchschnitte) sollen grundsätzlich nicht mitgegeben werden.
Ein solches „Frühstück“ packen wir den Kindern wieder in die Tasche.</div>
<button id="12a" class="btn" type="button" data-toggle="collapse" data-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive"><img src="img/click-elements/Line_FAQ.svg"></button>
</div>
</div>
</div>
видно в действии здесь: https://jsfiddle.net/9x35ka1d/13/
Как вы можете видеть, пока он работает!
Теперь, когда я включаю его в свою главную страницу, он вообще не работает.
Я также использую загрузочную навигационную панель, которая также использует коллапс, поэтому я подумал, что они могут быть противоречивыми, но, похоже, это так.
много кода, поэтому я упаковал его в другой jsfiddle прямо здесь: https://jsfiddle.net/a3k0juof/2/
вы можете найти развал внизу.
Я использовал инструменты браузера для поиска проблемы, и кажется, что js даже не запускается, но я не могу найти решение.
любая помощь будет оценена.
с уважением
jchanni