HTML Accordion закрывается немедленно при запуске с веб-сайта asp.net ⇐ CSS

[Anonymous]

Я пытаюсь создать складное меню и адаптировал следующий код под свои нужды (Фото: https://codepen.io/AndreasFrontDev/pen/zBZZvq). HTML-файл открывается и ведет себя должным образом при непосредственном открытии и при размещении на веб-сайте по умолчанию. Я пытаюсь использовать его в приложении asp.net от поставщика и обнаруживаю, что оно правильно отображает 4 основных заголовка, и когда я нажимаю на 1 заголовок, я вижу содержимое примерно на секунду, и он немедленно закрывается. Может ли кто-нибудь объяснить, почему это происходит или как это устранить. Код следующий. Я не знаю, почему этот файл ведет себя по-другому, когда на него ссылаются из приложения.

Код: Выделить всё

var acc = document.getElementsByClassName("accordion");
var i;

for (i = 0; i < acc.length; i++) {
acc[i].addEventListener("click", function() {
this.classList.toggle("active");
var panel = this.nextElementSibling;
if (panel.style.maxHeight) {
panel.style.maxHeight = null;
} else {
panel.style.maxHeight = panel.scrollHeight + "px";
}
});
}

Код: Выделить всё

body {
font-family: sans-serif;
}

.accordion {
background-color: #eee;
color: #444;
cursor: pointer;
padding: 18px;
width: 100%;
border: none;
text-align: left;
outline: none;
font-size: 15px;
transition: 0.4s;
}

.active,
.accordion:hover {
background-color: #ccc;
}

.accordion:After {
content: '\002B';
color: #777;
font-weight: bold;
float: right;
margin-left: 5px;
}

.active:after {
content: "\2212";
}

.panel {
padding: 0 18px;
background-color: white;
max-height: 0;
overflow: hidden;
transition: max-height 0.2s ease-out;
}

Код: Выделить всё

Accordion with symbols
In this example we have added a "plus" sign to each button. When the user clicks on the button, the "plus" sign is replaced with a "minus" sign.
Section 1

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Section 2

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Section 3

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Подробнее здесь: https://stackoverflow.com/questions/792 ... et-website