День добрый. Я недавно изучаю JS, есть простой скрипт
JS
window.onload = function () {
const BtReg = document.querySelector("#BtReg");
const close = document.querySelector(".close");
const modal = document.querySelector(".modal");
BtReg.addEventListener('click', function (event) {
modal.classList.add("open");
});
close.addEventListener('click', function (event) {
modal.classList.remove("open");
});
}
CSS
.modal {
display: none;
}
.open { /*класс, открывающий окно регистрации, к нему ссылаемся в джаваскрипте*/
display: flex;
}
Добавлен класс .open, который делает дисплей флексовым, открывает окно.
При клике на BtReg этот класс должен добавляться , на Close - закрываться. Если добавляю класс вручную в консоли, все работает, никаких ошибок нет. Но при выполнении окно перегружается, то есть при клике на кнопку регистрация, окно появляется и сразу пропадает. Надо чтобы оно оставалось статичным, это форма регистрации. Подскажите в чем проблема может быть? CSS или JS.
Да, действительно все работает, но я нашел в чем проблема у меня конкретно. В html моя кнопка обернута в форму, как я могу обратиться к ней из JS? Выглядит это как на примере ниже.
div class = "form"
form
button id="BtReg"open button
form
zvepb, Не имеет значения в форме он находится или в футере или где нибудь еще. В любой месте можете к ним обратится, глядя на мой пример так и обратитесь, если что скиньте весь код формы и скрипта разберемся.
TAbrahamyan, Ситуация такая, вот берем ваш пример, все работает. Но, оборачиваем все это в тэг форм и... В результате окно открывается и мгновенно закрывается. Код перестает работать как раньше. Не пойму до конца в чем может быть дело) Похоже на то, как будто страница сразу обновляется.
Простой