Не определяется функция слушателя событий
Показываю модальку:
<div id="callback" class="modal_b">
<div class="body">
<div class="ttl">Заказать консультацию</div>
<div class="dsc">Напишите нам и мы поможем вам разобраться в вопросах.</div>
<div class="form v_form">
<div class="field">
<input type="text" name="name" class="form-control" placeholder="Ваше имя" data-rules="required">
</div>
<div class="field">
<input type="phone" name="phone" class="form-control" placeholder="Телефон" data-rules="required">
</div>
<div class="field">
<textarea name="dsc" rows="5" class="form-control" placeholder="Сообщение"></textarea>
</div>
<div class="action">
<spa class="btn btn-action go">Отправить</spa>
</div>
</div>
</div>
</div>
По кукам:
function getCookie(name) {
let matches = document.cookie.match(new RegExp(
"(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)"
));
return matches ? decodeURIComponent(matches[1]) : undefined;
}
let mcookie = getCookie("mcookie");
if (mcookie != "no") {
setTimeout(function() {
showModal("obratnyij-zvonok/");
document.getElementsByClassName("fancybox-close").addEventListener("click", function() {
modalwin.style.display="none";
// записываем cookie на 1 день, с которой мы не показываем окно
let date = new Date;
date.setDate(date.getDate() + 1);
document.cookie = "mcookie=no; path=/; expires=" + date.toUTCString();
});
}, 1000);
}
Но почему-то ругается: Uncaught TypeError: document.getElementsByClassName(...).addEventListe ner is not a function |
Скорее всего у вас скрипт отрабатывает еще до того, как на странице появится ваше модальное окно.
+ метод `getElementsByClassName` возвращает `HTMLCollection`, а не `HTMLElement`, у которой нет метода `addEventListener`. Попробуйте так:
function getCookie(name) {
let matches = document.cookie.match(new RegExp(
"(?:^|; )" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1') + "=([^;]*)"
));
return matches ? decodeURIComponent(matches[1]) : undefined;
}
document.addEventListener('DOMContentLoaded', function() {
let mcookie = getCookie("mcookie");
if (mcookie != "no") {
setTimeout(function() {
showModal("obratnyij-zvonok/");
document.querySelector("fancybox-close").addEventListener("click", function() {
if ('modalwin' in window) {
modalwin.style.display = "none";
}
// записываем cookie на 1 день, с которой мы не показываем окно
let date = new Date;
date.setDate(date.getDate() + 1);
document.cookie = "mcookie=no; path=/; expires=" + date.toUTCString();
});
}, 1000);
}
});
|
Nexus, сделал как вы написали, теперь получаю ошибку:
caught TypeError: Cannot read properties of null (reading 'addEventListener') |
Timurkin,
точка нужна document.querySelector("тутfancybox-close") |
Цитата:
document.querySelector(".fancybox-close").addEventListener("click", function() {
|
Цитата:
s - множественное число. Дай элементы Функция дает список (псевдомассив) элементов, даже если он один. Надо обращаться к одному элементу
document.getElementsByClassName("fancybox-close")[0].addEventListener("click", function() {
|
рони,
voraa, точку добавил. Теперь: caught TypeError: Cannot read properties of null (reading 'addEventListener') |
В вашем html коде вообще нет элемента с классом fancybox-close. Я не знаю, что именно вы ищите, почему он должен быть и где.
В вашем коде его нет. Поэтому результат поиска этого элемента null. |
Цитата:
Самого модального окна на странице изначально нет. Но оно как раз вызывается в коде выше: showModal("obratnyij-zvonok/"); |
Ну значит надо в отладчике проверять, появляется ли там эта кнопка.
Поставить точку останова после showModal и посмотреть появилась ли она. Если нет - думать почему, если появилась, то с каким точно классом. Что такое "obratnyij-zvonok/" и точно ли там должен быть /? |
| Часовой пояс GMT +3, время: 06:24. |